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:
Today we moved all of Twitter's mobile web traffic (that's like, a lot) to our new web stack – Node.js, Express, React PWA.
— Nicolas (@necolas) February 8, 2017
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.
