13 ms·
Enhancing the New York Times Web Performance with React 18
- mason_mpls 2y agoHold on. Did they ditch their in house framework that’s supposed to be better than React? The one that rhymes with welt? I’m confused.
- csande17 2y agoThe New York Times never used Svelte for their main website code AFAIK. Instead, it's used for one-off interactive graphics within individual articles. (The article touches on this when they discuss how React 18 hydration changes broke the mechanism they were using to load these one-off widgets.)
- jrm4 2y ago[flagged]
- lawgimenez 2y agoI just want dark mode.
- mewpmewp2 2y agoMay be a stupid question, but why does a news website need React in the first place?
- qup 2y agoTo please middle managers
- umvi 2y agoBecause it's hard to hire web devs that don't use React. If you want something simpler than React, then it's better to just hire a generalist programmer who hasn't drunk the JS ecosystem kool aid and will use vanilla. It's the same reason companies with tiny apps in the cloud default to kubernetes even though it could have been done with something simpler like AWS lambda.
- dottjt 2y agoYou say it with cynicism, but ultimately React jobs pay better vs jobs which require only common HTML/CSS skills. Why wouldn't programmers want to pursue better paying/more readily available jobs?
- dmix 2y agoThere’s plenty of real world usecases that demand high interactivity async views. They should be a small subset of the page but there will always be demand for that sort of real time UX that pure static apps can’t provide. Pretending otherwise at a large company like NYTIMES that has multiple properties with hundreds of millions of visitors is unserious. They aren't running a simple blog or just a newspaper. I believe React/Vue will ultimately be replaced by recent modern developments using websockets to trigger the delivery of server side static async views. This is how Github/Shopify now does it, ala Elixir's LiveView, and Rails itself also has ActionCable+Turbo/Hotwire. It is far superior as it keeps logic in one place in the backend and in one language. But that is far from mainstream yet like React is and there will always be legacy features that need to be supported. But hopefully it will become the standard and JS will limited to necessity. For ex: some components on pages like charts/graphs, multi select boxes with autocomplete, etc will still require JS that websocket/ajax triggered views can't replace. But those are easier to package into standard libraries. Whether reactive vDOM will still be needed for that idk.
- ebiester 2y agoA generalist programmer will not have the chops to build interactive visualizations such as what the New York Times develops. Consider that backbone.js was developed by Jeremy Ashkenas to solve problems the NYT had with its layout. Perhaps the problems they have are more complex than what you suspect?
- umvi 2y agohttps://ciechanow.ski https://ciechanow.ski seems to be doing pretty well without complicated JS frameworks and his interactive articles I would consider top tier on the internet. As far as I can tell, he's a generalist and is using vanilla JS for all of his articles.
- solardev 2y agoThe article mentions interactives. The NY Times does do a lot of those (visualizations, tables, maps, etc.). > The New York Times has published millions of articles with hundreds of different components and tens of thousands of custom embedded interactives. Of course we wanted to fix all of our hydration mismatches, but how could we do so safely? I don't think that alone is a good reason to use React everywhere, but it's probably easier to just hire for that one stack than to try to maintain a vanilla JS stack and shim React into just the visualizations. IMO React generally makes life easier for developers (at the cost of bundle bloat for end-users). The Times probably found it an acceptable tradeoff. Their website seems pretty fast to me, FWIW, even throttled down to 3G.
- edflsafoiewq 2y agoIt "mentions interactives" in the sense that they say they don't use React for the interactives, and half of the article is about all the problems with embedding the non-React interactives in the React page.
- solardev 2y agoI missed that at a skim. Thank you for the clarification!
- mindslight 2y ago"Enhancing your car's engine performance with waterglass"
- mason_mpls 2y agoIt’s easier to add/maintain features and more performant than vanilla js
- w-ll 2y agoHow can framework bloat (my emphasis) be faster than vanilla js? I monitor the first paint on many sites, and the more js the later the paint. None can beat a normal site with some js niceties that trigger on dom ready.
- bigyikes 2y agoAgreed. There is no world in which React is faster than vanilla JS, except maybe certain contrived examples. Selling React as “fast” has got to be one of the greatest bamboozles of all time. I know I thought it was fast when I first started. It’s reasonably fast for what it does, but the overhead of virtual DOM diffing has real performance costs compared to vanilla. React makes it really easy to make things slow. At my job it isn’t uncommon for a single list item component to take 2ms to render on a fast machine. Multiply that by a few dozen list items, and suddenly your feature is taking hundreds of ms to rerender. Sure, you can improve things with virtual rendering and targeted optimizations, but the default case is not fast. It’s especially insane when you consider that video games can render a high fidelity 3D scene in under 16ms.
- mason_mpls 2y agoThe overhead of the virtual dom is less than modifying the actual dom unless you’re using little to no javascript. If your company’s front end that happens to have react is slow, I’m willing to bet removing react will make it even slower.
- jauntywundrkind 2y agoIt's funny how such snooty nose-in-the-air attitude about boutique hand written js masquerades as a choice any company can make. So, we can only hire artisans who hand tailor every event handler, who writes bespoke careful updates that never conflict and always handle every corner case of the dom right? And you and your 63 clones that NYT has hired will all work in harmony & concordance doing your bespoke vanillajs practices. Reacts vdom is pretty sweet. Even the old iterations of React can go eliminate a lot of paints. Old websites used to have plenty of write-read-write loops that internally block the dom, that react's lifecycle generally helps guard against. The article here talks about even further improved batch updating that React 18 can help with. Apologies my attitude, but it's just remarkably how much rancis ass attitude there is about React & how fucking stupid it sounds. I know it's the internet, that people will forever be springing up to spout off, but it's so sad having such miserable negativity hounding such perfectly respectable tech.
- deleted 2y ago[deleted]
- ahwvd37js 2y ago[flagged]
- willio58 2y agoCool details! Thanks for posting.
- deleted 2y ago[deleted]
- rohan_ 2y agoI thought they used Svelte?
- alberth 2y agoSo odd they publish to Medium, and not their own NYT platform.