This content originally appeared on Go Make Things and was authored by Go Make Things
One of the oft-repeated myths I hear from framework evangelists is that tools like React are better for performance because “they use a virtual DOM instead of the real DOM.”
First, that’s objectively false.
In certain situations (like UIs with comically large amounts of div
nesting) moving DOM diffing to a virtual layer can improve the performance of that specific step. But eventually, they have to touch the real DOM. That’s how you manipulate and update elements.
I’ve been talking about how terrible React is for performance for years.
In 2018, Netflix famously dropped client-side React for vanilla JS and dramatically improved performance. A few years ago, my friend Jeremy Wagner ran some tests showing that React is orders-of-magnitude slower than both vanilla JS and Preact, which uses the same API. And last year, I looked at some new browser usage data and how libraries make the web nearly unusable for certain groups of people.
It probably won’t surprise you that I found my friend Zach Leatherman’s article on the history of React performance issues incredibly interesting. The icing on the cake…
An analysis of Core Web Vitals across 9.3 million web sites as of February 6, 2023 shows that Core Web Vitals for both React and Next.js shows that both perform worse than the aggregation of all other sites in the archive for both mobile and desktop.
React was, is, and probably always will be a worse choice for performance than other options.
Is there a JavaScript or web development topic you'd like to learn more about? Send me an email and let me know.
This content originally appeared on Go Make Things and was authored by Go Make Things
Go Make Things | Sciencx (2023-02-21T14:30:00+00:00) React is still absolutely terrible for web performance. Retrieved from https://www.scien.cx/2023/02/21/react-is-still-absolutely-terrible-for-web-performance/
Please log in to upload a file.
There are no updates yet.
Click the Upload button above to add an update.