Refined Twitter | Hacker News Reader

Refined Twitter

github.com

179 pointsmofle108 comments

> The new mobile web version of Twitter is much faster and better looking than the desktop one.

It's certainly much faster. I'm using it on my netbook which used to run the desktop version equally as fast.

Why can't big development teams think about accessibility as it applies to older hardware? It's clear that it's getting to be a big problem for Twitter let alone other companies (see previous discussions about Bloat)

The only thing I can think of is that the developers use the shiny new hardware and it runs okay for them. Or if the devs want to change, the management and board runs the fast hardware and it's "working for them".

Runtime speed has not been a priority in most apps/websites in a long time. Even relatively new phones struggle with things like modals and swipe effects on mobile websites. So much effort is spent on making things feel "native". Native, in my opinion, should mean fast before anything else.

Flipboard's mobile site is amazing at this. 60fps on mobile.

I mention this a lot but...

I used to work at a place that had a ~5 year old pc on a <1Mb internet connection to test their software. If it ran find on that, then it would run fine on most of their users hardware.

I wish more companies did this.

For the Android app development we do for clients, I have a $10 trac phone I got from Walmart.com. That was the phone price without subsidy or any extra cost.

Android can be a bunch of hurdles, but we use same mentality as this for our app designs.

I hear a lot of people in tech idolizing "good design". But is a design really good if it doesn't work everywhere?

Performance should be a key factor of judging any design. Both heuristic user performance and actual measurable software speed.

There's no real way to measure hardware as it pertains to power and speed. The best thing we have is browser and OS detection. If there was a way to determine hardware that'd be pretty useful.

navigator.hardwareConcurrency provides the number of logical CPU cores. Additionally, GPU detection is possible with WebGL extensions. That said, this is clearly incomplete from what data would be ideal.

You're missing the point. The goal is to maximize a small set of metrics. Engagement, New User Experience, etc.

They make these changes and roll them out. They look at the numbers. They see that 5% of their users (those on older hardware) spend 20% less time on the site. They see that 20% of their users are spending 50% more time on the site. They file a ticket about the drop in engagement for older devices. It goes into the backlog. Next sprint/quarter rolls around, they see a couple of options. One is to speed up the site on old devices another is to add a new feature that they estimate will increase engagement by another 20%. The second option seems to increase their bottom line more, so it gets funded and the old device support stays on the backlog. Repeat cycle.

I can guarantee that at any sufficiently high traffic site they don't use developer hardware as a benchmark. They see the numbers, they know its slow for you and they make a conscious decision that you aren't worth the opportunity cost of new features.

This but with one minor correction, the developers usually want to fix the experience. It's the management / project owners / etc that use the aforementioned analytics to make their judgement.

Perversely, I've also often observed that those who spend the most time judging a sites performance on its analytics are usually the ones who actually use the site the least. or at least this is what I've observed with past projects I've worked on.

One further (possible) correction: a "discussion" was had in the past whether to fix this, dev wanted to fix and PM didn't, or vice versa - whoever is the most politically powerful wins, regardless of metrics impact (all relevant facts aren't reported to senior management so sanity could prevail).

> those who spend the most time judging a sites performance on its analytics are usually the ones who actually use the site the least

It's a weird part of human tribal/social dynamics. People who already generally like a thing are open-minded to new information that presents the thing in a positive light, and just generally ignore new information that presents the thing in a negative light. Likewise, people who already generally dislike a thing filter out the prosthelytizations of people who like the thing, but pay attention when they notice reasons to dislike the thing.

Basically, our brains' belief-evaluation machinery is really just a wrapper around a core "generate excuses to keep thinking what I'm thinking" algorithm.

We can exploit this—adversarial justice systems work much better than non-adversarial ones, because you've got two sides who each have paid attention to half the evidence, brought together in the same room to present it all. But if we aren't exploiting it, aren't even aware of it, it can become a real problem.

One thing is always clear -- a big Co's interest is not always your interest.

Which is why I love what Sindre is doing -- letting us to customise our experience with products that ignore it by themselves. I wish there were more projects doing that. Demand is definitely there.

Check out this blogpost by Facebook on FB Lite (not vail in the US unfortunately, so I haven't had the chance to play around with it myself).

https://code.facebook.com/posts/1365439333482197/how-we-buil...

As much as I dislike FB for other reasons, you gotta give them credit for caring a lot about performance.

> The only thing I can think of is that the developers use the shiny new hardware and it runs okay for them.

I think that was one of the problems with Google+ in the early days. They launched a social network that assumed a huge screen resolution (because that's what they used), so the interface was too big and clunky for a lot of people.

It's not only faster, I also think that the interface is actually much cleaner and focussed (only wish that the "new tweet" link would be sticky).

Same is true for Wikipedia btw. Mobile version is much more readable imo https://en.m.wikipedia.org/wiki/User_experience https://en.wikipedia.org/wiki/User_experience

Amazing, if I click a tweet, and go back, I don't lose my place. Wondering why desktop twitter had this problem (until they made that pop-up UX).

They clearly need to hire more engineers.

This is a massive issue with the stateless aspect of HTTP, since the history API doesn't refresh the page and the state and components don't update (since its a React app) there's no magic needed to keep scroll position, but the router could be doing something I'm not aware. I've been looking for that solution for years and the first time I've seen it simply and clearly done is the Real World example in the Redux source.

>I've been looking for that solution for years and the first time I've seen it simply and clearly done is the Real World example in the Redux source.

This is very heartwarming. Thank you for the feedback!

Hmm? Desktop Twitter is pretty good at that too in my experience

I find myself consistently wondering why I pay money for a third party client five years into my use of Twitter (I was late to the party).

What's more is that Twitter knows what I follow, what I read, what I like, and what I retweet. So why is it still suggesting I follow pop celebrities instead of well known developers? It seems that despite everything they know about me, they don't know me at all.

Moments is a prime example of how out of touch Twitter is. I've clicked on it three times to see, and each time the stories are celebrities or sports. They know enough about who I follow, what I tweet about and the hashtags that come up to target enterprise technology ads to me, why can't they use the same data to customize that page? It's utterly useless in its current form.

Before Moments there used to be a tab that showed you tweets that your followers were replying to. I used to use that all the time to find new people to follow.

Way back in the beginning, when you followed someone you got all their tweets - including replies to people you don't follow.

Then they made it an option to not get these, then they took away that option and made it mandatory.

This, plus their really terrible behavior towards developers (still going on, as evidenced by their continuance of the 100K tokens limit per app) has seen me basicly stop using the service entirely.

Useless to you, but you're probably not in the target demographic for the feature.

Moments is about lowering the bar to new users of Twitter (the discovery problem) and get existing users more engaged in sharing content so Twitter is more valuable to them.

For those users, celebrities and sports is exactly what's going to draw them in. Twitter can then sell ads against those users.

I'd be surprised if it had any kind of algorithmic targeting any time soon, or if enterprise tech firms were looking to get involved in producing native Moments content in any serious numbers.

Especially when compared to Facebook's news sidebar. When it came out I remember it was similar to moments, lots of celeb and sports news. Now it knows only to show me politics and gaming news.

Facebook is the same.

On reading these "trends", it's like they want us to feel like we just walked into a bar full of people that we loathe.

Earlier on Facebook I decided to see if there was anything at all interesting on the 'trending' tabs:

- Top Trends : 10 stories - Politics : 8 stories - Sports : 8 stories - Entertainments: 10 stories - Science & Technology : 1 story..

really?? pfft. Kids today.

That. And GP. And this is exactly the reason why I don't believe a single word in all the stuff about AI and deep blabla. If Facebook cannot suggest better news, it's because it's most probably impossible to simulate how my best friend did suggest me to watch les combatants (a French movie I loved). Neither the casting, the director (all unknown) or the theme (a young guy going to army training to follow a girl) or any other objective feature of the movie could have helped. It's done purely on feeling, intimate knowledge of our respective tastes, long time friendship (30 years). In a word, alchemy. That's just not going to be modelized any time soon or later.

The only thing I get from suggestions are either dim variants of the things I already liked, or random stuff high on popularity charts.

Had and have exactly the same problem!

Several years ago that was the reason I made jetwick:

https://github.com/karussell/Jetwick

https://www.youtube.com/watch?v=9U2uxeaVIXk

which sadly does not work anymore as I gave up on the several API changes.

The beauty was that I could search (and memorize) any hashtag I liked and then sorted this by retweets AND if I was away for holidays I came back and see only these newer tweets and have those sorted again by retweets.

Also sorting your timeline by retweets is really powerful.

This way you do not waste time to discover things and you do not need to trust an algorithm to find something interesting (although I loved getprismatic.com and like http://tweetedtimes.com/) but I can actively search for stuff

I also tried to combined hackernews in the mix to find more stuff outside of my follower set and e.g. find people to follow but also have the possibility to sort hackernews by XY AND filter by my topic which I still really miss here too :)

There was also a nice feature to find the first tweet of a certain link/tweet to learn which people really post 'hot stuff' and which just copy things.

I've very nearly rage quit Twitter over that bug. The WP 8.1 client doesn't have that problem.

Mobile web Twitter is awful at this for me. I don't have a Twitter account; I'm not sure if the UI is as bad when logged in.

I have an account, and it is. it means I pretty much only use twitter on a desktop.

Author here. I also made a desktop app for this: https://github.com/sindresorhus/anatine

This is why Grease Monkey existed. How many per-site plugins can someone have? http://www.greasespot.net/

To your question: A lot. How easy is it to install a chrome plugin vs. install a packaged, auto-updating Greasemonkey script? What is the real difference in performance?

Realistically? Not much.

But I just installed it and while Chrome is running, it's taking up an additional 57.1MB of memory right now.

That said, I've installed it and I think I'm going to keep using it.

A greasemonkey script in Chrome would take the same amount of memory or more, as Chrome just repackages it as an extension on install.

I'm pretty sure that's not how Tampermonkey works.

This extension redirects requests before they've even started, making it much faster than what's possible with a Greasemonkey script. Greasemonkey scripts are also hard to discover and install these days.

Userscripts can also run before any content scripts through `@run-at document-start`. With a browser extension, you're giving up portability, security (an extension can wreck a lot more havoc than a site-specific script) and the freedom to publish without being dependant on a "store".

This extension redirects before a request is even made. `document-start` runs when the whole page is downloaded, but before the DOM is constructed, which is a lot slower. As for portability, both Firefox and Edge are committed to supporting Web Extensions, which is pretty much the Chrome extension API. This extension is not tied to any store. You can install it manually exactly as you would with a userscript. Actually, userscripts in Chrome, are just re-packaged as native extensions on install.

Here it is as a Greasemonkey script:

https://gist.github.com/nikcub/b8cf72f564cde9000875be798e883...

Most people don't know this but Chrome supports GM scripts natively - just save the file as `whatever.user.js` and drag + drop it onto the extensions window.

One downside of this approach: it redirects to the mobile interface after the HTTP request and DOMReady

Does anybody have any insight into Twitter's development structure? Do they have a separate mobile and desktop team; a single team; or separate teams where the desktop team just keeps the thing going until the mobile team can scale theirs up to desktop? Just curious.

Dunno if this is still the case, but throughout my tenure there (2010-2014), mobile web and desktop were totally separate teams with separate codebases.

I met an engineer from Twitter at a conference and he said he was on a team (6+ people) that worked full-time on the Lists page for the Twitter.com desktop site. So anecdotally, they have (or at least had) very specific teams.

would be cool if one of them could add lists to the mobile web site since lists are completely left out of there.

Interestingly, if you have the URL to one it works, but there is no interface to get to them.

The recent OS X update (major revision, in December or so?) was an app that Twitter contracted out to a third party.

That should show about how much they care about clients outside of Twitter.com.

I used to have an office below their Folsom Street place a few years ago

They had far, far, far, too many people working for them doing nonsense-led minutiae even back then.

Mobile web is the new tru web. (it's clean, simple, fast, just like it used to be ~_~).

That said, I do miss the keyboard shortcuts, and the TT. But I see below it's incoming.

A while back I created this client that lives in OSX Menu Bar also based on the mobile version of Twitter, it includes a few handy keyboard shortcuts.

https://github.com/soheil/BirdDrop-OSX

    <div id="react-root" style="height:100%;">

Made with React apparently. Interesting.

and redux and react-router

I saw that too! I've recently dipped my toe in, making a module for a small project using React instead of Angular 1.x as I usually would do. One thing I'm still working out is how to look at how complex websites use React, as in the Chrome DevTools React plugin there's a lot of complexity in the React hierarchy, and code uglifying that appears to have been run on it for performance reasons makes it hard to reverse engineer

I would recommend to look into a well organized boilerplate repo to learn how to structure larger projects. Here's one for react/redux/react-router: https://github.com/davezuko/react-redux-starter-kit

Try running uglified script through this.

It does a pretty good job : http://unminify.com/

Thanks for releasing this, and seriously, thanks for the ridiculous amount of effort you seem to put into the open source tools I'm using daily.

/gush

Very nice.

Hopefully it also gets rid of the super annoying "While you were gone" sections.

Downside is you see ads in your stream with mobile twitter which I don't see with desktop twitter.

Your stream doesn't feature ads? Mine is chock-full of them on desktop web.

None on desktop. Possibly due to uBlock?

Ah yes. What's curious is that uBlock doesn't block the mobile ones as well!

Then you close them. And they ask 'did you like this?'. And you say NO. Rinse and repeat.

They don't ask "do you like this?" anymore. They ask something like "show more like this?" and I'm afraid clicking No will remove tweets from people that happened to be in the "while you were away" section.

I have been using Twean + uBlock element blocking for awhile now: https://chrome.google.com/webstore/detail/twean/mgdbopghpkjm...

Since I always disable image preview in the mobile app, I find Twean suits my needs perfectly.

Since we are talking about refined Twitter experience here, I thought I will share my issue and hopefully one of you has a solution.

So I follow a lot of lit mags and other literature related accounts and persons. Often the same story is (re)tweeted multiple times by the mag accounts and even by persons. Now, getting lesser tweets for a given time is one of the criteria I follow for following any twitter account so that I don't miss others or I've to look at one tweet exactly once in my feed.

How do I achieve that? Is there a Twitter setting for that? I doubt it - because many of those tweets are actually different tweets with the same link (but different shortened URLs) and separate comments about the article. Add to that many other tweets that fans and followers make and the magazines retweets them.

That's just too many tweets for one article. I understand that the mags have to do it for the reach and everything but, personally for me, it's very inconvenient. What do you do when you face such problems? (I could just subscribe to their feeds but I wanted to know about cleaning my Twitter feed if at all that's possible)

An example:

https://twitter.com/aeonmag/status/728087014407475200

https://twitter.com/aeonmag/status/728026712894738432

https://twitter.com/aeonmag/status/727951285488631808

https://twitter.com/aeonmag/status/727860663515746304

https://twitter.com/aeonmag/status/727830459175084032

(I love this mag btw)

If the mobile Twitter site supported the keyboard shortcuts of J/K for next/previous, then this would be perfect.

I intend to add some keyboard shortcuts. Comment your needs here: https://github.com/sindresorhus/refined-twitter/issues/5

Just use vimium.

I'd really use a Firefox version of this. Wondering how far am I from knowing how to port it myself.

It should work in Firefox 48. See https://github.com/sindresorhus/refined-twitter/pull/3 and https://blog.mozilla.org/addons/2016/04/29/webextensions-in-...

Happy to add something to the readme if anyone can test and confirm.

It works out of the box in Firefox 48.0a2.

Navigate to about:debugging, and load the manifest.json as a Temporary Add-on.

It will stay installed until you close the browser. I don't think permanently loading extensions this way will work in the normal Extensions pane until Firefox 48 is in release.

See the "Chrome compatibility" section: https://blog.mozilla.org/addons/2016/04/29/webextensions-in-...

Unfortunately Twitter's mobile site does not support lists

Exactly, still unsure why Twitter left Lists out of the mobile web version of the site.

Lists are pretty much hidden in the desktop version, along with Advanced Search. I assume these are too geeky for the target audience....

I wrote an extension to bring lists out of hiding. Haven't done anything for the new mobile web app yet, waiting to see if they'll make an appearance officially soon.

https://chrome.google.com/webstore/detail/twitter-lists-redu...

Unfortunately, I don't think Twitter gives lists enough attention because it's an underused feature, but at the same time, if lists are unusable.. of course no one is going to use them.

Nice, I remember seeing this on ProductHunt. I'm working on electoralhq.com which provides Twitter Lists search and management tools. Shifting into building scoutzen.com now though in order to be more independent of Twitter Lists since they get such little attention from Twitter.

But the whole purpose of anyone using tweetdeck would be lists. I mean I use it for lists.

But then again, Twitter shut down the desktop Tweetdeck version. I hope you are wrong and twitter gives lists more attention.

Right, feels like Lists may come up on the chopping block soon.

"Dumbed Down" != "Refined". I see value in his Refined GitHub, but Refined Twitter I had to disable and will have to revisit.

This isn't really the same thing as Refined Github though. It's just redirecting to the new Mobile Twitter. I've yet to notice a missing feature (although there are things missing that I don't consider "features", like trending topics and moments). It also works far more reliably for me: for example, try scrolling several dozen tweets down the feed in both Mobile and Desktop Twitter, clicking on a tweet, then clicking back. I've yet to see Mobile lose my place, whereas Desktop does more often than not, and when it doesn't it has to spend a minute triggering its own infinite scroll.

Similar branding suggests similar functionality, i.e. not overhauling, but "refining," i.e. making useful small improvements. Yes, there are missing features - from account management ones to little things like being able to mention somebody while on their profile.

> > "Chrome extension that enforces the mobile web version of Twitter and improves its interface"

What does 'enforces' mean? What does this do?

Let me direct you to the next sentence:

"When you open a link that would normally be to desktop Twitter, this extension redirects you to the mobile web version and makes it wider."

Ah. Here's a simpler explanation:

> This makes Chrome always use the mobile web version of Twitter, which has a different UI to the desktop web version.

>When you open a link that would normally be to desktop Twitter, this extension redirects you to the mobile web version and makes it wider.

Requests to normal Twitter are redirected to the mobile version, which is on a sub-domain.

My group DM's aren't showing up in my Messages section! Otherwise, this would be the perfect extension for me!

A heads up on missing features on mobile.twitter.com:

- No moments feature

- No trending hashtags

- Can't tweet polls

- Gif search missing

- Tweet analytics missings

Is there any way to read notifications on mobile twitter?

? Click the icon that looks like a bell.

On https://mobile.twitter.com/ ? I don't have a bell icon. http://i.imgur.com/2xnV1iS.png

Twitter gives Firefox its "simple" app for feature phones. Go to it in your desktop browser to see the diff.

Desktop Firefox looks the same. Chrome is different though. Wonder why they do that?

Because they want to deliver a good experience to every user and redirecting to the simple version is the easiest way to do that. If they served mobile.twitter.com to Firefox for Android users they would have to test the site in Firefox for Android and since only like 12 people use Firefox for Android it's not worth their time to do so.

They're going to have to deliver (and test) one version or another. Or if they're not testing, they might as well send an untested normal version instead of the untested simple version.

Doesn't that @ symbol at the top take you to your mentions?

Oh, it does! That's an odd place to put it. Thanks!

Update: I spoofed my user-agent string to get the normal mobile version in Firefox. It mostly works except images don't load! I'm done digging into this for now, but it's kinda bizarre.

I use Twitter on Firefox mobile and didn't know until this article that it's for some reason forcing an old ugly version. What UA string are you using? I tried the Android (Phone) one, and the Chrome one that the Phony extension provides but it still shows the ugly FF version of mobile twitter.

Any user-agent that mentions a recent Chrome and Android build should shows the new mobile.

I test one that has Chrome 43 and Android 5.0.2

Still, the no-image-load grind my gears, so I switched to desktop.

How long until they block it? har har

They can't. For them it's just a normal browser.

Apparently Twitter can't find good engineering talent. I hope it considers hiring this developer.

I'm sure Twitter has great engineering talent. Whether they're allowed to do their jobs is another matter.

This is mobile.twitter.com. It's built by twitter's engineering talent.

Can you add ad blocking?

Any plans for a Safari plugin?

Reply on news.ycombinator.com