BT

Your opinion matters! Please fill in the InfoQ Survey!

Twitter's React-Based Mobile Web Stack Rivals Native Performance

| by David Iffland Follow 3 Followers on Feb 17, 2017. Estimated reading time: 2 minutes |

A note to our readers: As per your request we have developed a set of features that allow you to reduce the noise, while not losing sight of anything that is important. Get email and web notifications by choosing the topics you are interested in.

Twitter recently switched all of their mobile web front-end users to a modern, JavaScript-based web stack. In doing so, they demonstrated how advancements in mobile web technologies rival the performance of native-based apps.

In a casual Twitter post, Twitter engineer Nicolas Gallagher said that the move was done:

This rather cryptic tweet left a lot of questions hanging in the air; most importantly, "What was it running before?" Ghallagher continued tweeting to fill in some of the gaps.

The "new" web stack has actually been in production for over 9 months for those logged-in users. Logged-out users were actually served by a different stack comprised of Scala and Closure Templates. Back when the logged-in experience changed, React developers approved.

The new browser-based UI is built atop React with Node.js and Express handling the server side. The app is built as a Progressive Web App which uses Service Workers to enable immediate page loading, offline capabilities, and push notifications. The app does not yet support all of those features, but another Twitter engineer, Paul Armstrong, indicated that would be coming soon.

The back-end is not running React on the server. Twitter engineer James Bellenger indicated that the back-end service "does no react rendering and nearly no route processing." He added, "the hardest thing the service does is parse json." In a series of tweets, Bellenger offers more insights into how the service works. For starters, it runs on the current Node.js LTS version and they use handlebars instead of React rendering.

The community is clamoring for more information on how they handled the challenges dealing with a site with such massive traffic. Stuart Langridge replied that he would like "to see a detailed post (or many, many posts) about how all this happened, problems you ran into, etc, etc."

Ryan Johnson wrote up an independent analysis of Twitter's Redux store and found some interesting insights. Speaking with InfoQ, Johnson said seeing Twitter's implementation gives him confidence in the technique:

One of my concerns with Redux has always been how much data is too much data for the store? You can see that Twitter continually adds tweet data to the store as you scroll, or when new tweets come in. If Redux can handle Twitter’s data I feel pretty confident that it can handle anything I can throw at it.

Performance on the mobile site is top notch. "I found the mobile site to be incredibly smooth responsive, and in my opinion it could easily replace the native app," said Johnson.

The new web app is available at https://mobile.twitter.com.

Rate this Article

Adoption Stage
Style

Hello stranger!

You need to Register an InfoQ account or or login to post comments. But there's so much more behind being registered.

Get the most out of the InfoQ experience.

Tell us what you think

Allowed html: a,b,br,blockquote,i,li,pre,u,ul,p

Email me replies to any of my messages in this thread
Community comments

Allowed html: a,b,br,blockquote,i,li,pre,u,ul,p

Email me replies to any of my messages in this thread

Allowed html: a,b,br,blockquote,i,li,pre,u,ul,p

Email me replies to any of my messages in this thread

Discuss

Login to InfoQ to interact with what matters most to you.


Recover your password...

Follow

Follow your favorite topics and editors

Quick overview of most important highlights in the industry and on the site.

Like

More signal, less noise

Build your own feed by choosing topics you want to read about and editors you want to hear from.

Notifications

Stay up-to-date

Set up your notifications and don't miss out on content that matters to you

BT