React is killing the web

Too Long; Didn't Watch — Summary

React's widespread adoption as the default web framework is debated for its impact on front-end innovation, with arguments suggesting it stifles the evaluation of technically superior alternatives, while others highlight React's continuous, albeit often overlooked, innovations in areas like asynchronous scheduling and rendering.

Main Takeaways

• React's default status, while standardizing development, is seen by some as hindering innovation by discouraging the exploration of alternative frameworks.
• Alternative frameworks like Svelte, Solid, and Qwik offer distinct technical advantages, such as compile-time optimizations, fine-grained reactivity, and resumability, which can outperform React in specific scenarios.
• Framework adoption is influenced by factors beyond technical merit, including team familiarity, long-term viability, codebase scalability, performance ceilings, and the perceived 'good enough' nature of existing solutions.
• Understanding web fundamentals is crucial for developers, as over-reliance on any single framework without this foundational knowledge can limit adaptability and lead to issues.
• React continues to innovate, particularly in asynchronous scheduling and rendering with features like Fiber, Suspense, and Server Components, though these advancements are often overshadowed by its success and the complexity they introduce.
• The technology adoption curve highlights that new frameworks must first win over innovators by solving significant problems, a challenge when current solutions are largely perceived as sufficient.

Detailed Summary

Introduction to React's Dominance (0:00 - 0:57)

The video introduces the premise that React has become the default framework for web projects, including new AI tools. This dominance presents a dual perspective: standardization versus potential stagnation of innovation. The discussion is framed around a blog post by Loren, which argues that React's default status is slowing innovation, and includes reactions from the community, notably Ricky, a React developer at Meta.

• React is now the default for most web projects, including new AI tools.
• This standardization is seen as both a positive (cool, standardized tool) and a negative (potential slowdown of innovation).
• The video will thoughtfully discuss React's strengths and its current position.
• Community reactions, including from Ricky at Meta, will be explored.

Sponsor Segment: WorkOS (0:57 - 2:57)

The presenter shares a personal anecdote about regretting rolling his own OAuth solution for T3 Chat, which led to significant financial and time losses over seven months. He advocates for WorkOS as a superior alternative for enterprise-grade authentication, emphasizing its ease of integration for complex requirements like SAML and ADP.

• The presenter regretted rolling his own OAuth for T3 Chat, losing millions of dollars and significant time.
• WorkOS is presented as a solution for enterprise-grade authentication.
• It simplifies integrations for complex requirements like SAML and ADP through an admin portal.
• WorkOS offers the first million users for free.
• Major companies like OpenAI, Plaid, and Vercel use WorkOS.

React's Default Mindset and Technical Foundations (2:57 - 4:22)

The discussion returns to Loren's article, which asserts that React is winning by default rather than technical merit, leading to a self-perpetuating cycle where network effects dictate architectural choices. The video acknowledges that while React is suitable for many projects, its default selection often prevents the evaluation of more fitting alternatives. It delves into React's technical foundations, particularly the Virtual DOM, Hooks, and Server Components, and their associated complexities.

• React's dominance is attributed to default selection rather than technical superiority, hindering innovation.
• Many projects use React inappropriately, while others that should consider it do not.
• The Virtual DOM, a clever solution for 2013, is now seen by some as overhead that modern compilers can avoid.
• Hooks, while addressing class component issues, introduce complexities like dependency arrays and misused effects.
• Server Components improve time to first byte but add architectural complexity and new failure modes.
• The React compiler optimizes around inherent model constraints, a trend also seen in other frameworks like Vue and Svelte.

Alternative Frameworks and Their Approaches (4:22 - 11:09)

The video contrasts React with alternative frameworks, highlighting their unique approaches to front-end development. Svelte's compile-time reactivity, Solid's fine-grained reactivity, and Qwik's resumability are discussed as innovations that can outperform React in specific scenarios. The presenter also introduces a framework evaluation model based on team familiarity, long-term viability, codebase scalability, performance ceiling, and adherence to standards.

• Svelte 5's runes simplify reactivity at compile time, eliminating framework overhead and aligning with web fundamentals.
• Solid offers fine-grained reactivity with JSX familiarity, updating only affected DOM nodes and bypassing reconciliation bottlenecks.
• Qwik uses resumability to achieve instant startup by loading only necessary code, avoiding traditional hydration issues.
• The presenter introduces a framework evaluation model considering team familiarity, long-term viability, codebase scalability, performance ceiling, and standards/accessibility.
• React balances these factors well, but other tools might be more suitable depending on project needs.

The Problem of "Good Enough" and Developer Mindset (11:09 - 19:04)

This section explores the idea that React's success stems from solving significant problems that previously plagued web development, making it a 'good enough' solution for most. The presenter argues that the remaining problems are often not substantial enough to motivate developers to explore alternatives. He emphasizes the importance of understanding web fundamentals and not using tools as a substitute for knowledge, especially for less experienced developers.

• React's success is attributed to solving major web development problems, making it a 'good enough' solution.
• The remaining problems are often not significant enough to drive adoption of new frameworks.
• Developers should understand web primitives and fundamentals, not just framework-specific patterns.
• Using tools without understanding their underlying mechanisms can lead to debugging difficulties and scalability issues.
• The presenter's "hot take" is that the worst part of defaults is that less skilled developers gravitate towards them, hindering innovation.

Benchmarks, Adoption, and Problem Space (19:04 - 35:50)

The video critically examines the JS framework benchmark, noting its specific test cases might not reflect typical application performance. It argues that the perceived lack of adoption for alternative frameworks isn't due to a lack of merit, but because the problems they solve aren't big enough for most developers to justify switching. The discussion highlights how React significantly reduced the web's problem space, making further incremental improvements less impactful for the average developer.

• The JS framework benchmark, while compelling, uses specific test cases (e.g., swapping rows in large tables) that don't always reflect real-world application performance.
• Solid and Svelte perform exceptionally well in these benchmarks, often close to vanilla JavaScript.
• The presenter argues that alternative frameworks are under-adopted because the problems they solve are not significant enough for most developers to switch from React.
• React's initial adoption was driven by its ability to drastically reduce the problem space for building large, scalable web applications.
• Incremental improvements offered by newer frameworks, while technically superior, don't offer the same magnitude of problem reduction as React did initially, leading to less motivation for adoption.

Framework Complexities and Ecosystem Challenges (35:50 - 47:00)

This segment addresses the complexities of various frameworks, arguing that while React has its own, alternatives like Svelte and Qwik also introduce unique challenges or deviate from web standards. The discussion touches on the "network effect prison" of React, where job postings and institutional inertia favor React, potentially stifling skill diversity and innovation. The presenter emphasizes that hiring should prioritize fundamental knowledge over framework-specific experience.

• The claim that React's surface area is notably larger and more complex than alternatives is debated; other frameworks also have their complexities.
• Cloudflare's outage due to useEffect misuse highlights the challenges of React's API, but also the importance of using appropriate libraries like React Query.
• The "network effect prison" of React's dominance is acknowledged, where job postings and institutional inertia favor React, potentially limiting skill diversity.
• The presenter argues that hiring should focus on fundamental web knowledge rather than specific framework experience, as skilled developers can adapt.

Web Components and React's Stability (47:00 - 56:29)

The video dismisses web components as a viable alternative for application building due to their limited composability and the general consensus among framework creators. It then defends React's stability, arguing that its ability to run ancient code alongside new patterns with full composability is a significant, often underappreciated, strength, contrasting it with other frameworks' breaking changes.

• Web components are deemed unsuitable as a general solution for application building due to limited composability.
• React is praised for its stability, allowing old code to run alongside new patterns with full composability, unlike other frameworks with breaking changes.
• The server components rollout is noted as an exception to React's typical smooth adoption of new features, being harder to integrate due to requiring root-level implementation.

Monoculture, Evolution, and Innovators (56:29 - 1:05:10)

The discussion shifts to the dangers of monoculture in web development, where one framework's constraints become de facto limits, and talent focuses on framework-specific issues. The presenter argues that while diversity is crucial for innovation, most developers don't need to be at the bleeding edge. He emphasizes that new frameworks must win over innovators by solving significant problems, as the average developer is content with 'good enough' solutions.

• Monoculture in web development can stifle evolution, as framework-specific issues consume developer time and investment follows incumbents.
• Curricula often prioritize immediate employability with framework-specific skills over transferable fundamentals.
• The presenter believes most developers should use 'good enough' tools, while the best developers should pioneer new solutions.
• Innovation is driven by innovators who are excited by new solutions, not by forcing adoption on the late majority.
• The current challenge for new frameworks is that innovators don't perceive the problems as significant enough to warrant switching.

Ricky's Perspective: React's Scheduling Innovations (1:05:10 - 1:12:50)

The video concludes by examining Ricky's counter-argument that React is indeed innovating, particularly in asynchronous scheduling and rendering. Ricky argues that React's advancements in Fiber, Suspense, Transitions, and Server Components address fundamental UI scheduling problems, which are often overlooked in comparisons focusing solely on CPU rendering. The presenter acknowledges the validity of this perspective, especially for large-scale applications like Facebook, where scheduling complexity is a major bottleneck.

• Ricky argues that React's innovations in scheduling (Fiber, Suspense, Transitions, Server Components) are overshadowed by its success.
• He believes the core problem in UI frameworks is scheduling, not just CPU rendering.
• React has implemented features like Suspense for loadable chunks, Transitions for prioritizing user input, and streaming SSR for scheduling work in different physical places.
• Ricky suggests that other UI libraries are now implementing similar scheduling features, indicating React's influence.
• The presenter agrees that for extremely large applications, scheduling is a critical performance bottleneck that React is actively addressing.

Notable Quotes

"Whether or not you like React, I think it's fair to say it's kind of one. It's become the default for almost all web projects, especially with all these new AI tools being built today." — The presenter

"React is no longer winning by technical merit. Today, it's winning by default. That default is now slowing innovation across the frontend ecosystem." — Loren (via the presenter)

"The problem isn't React itself. It's the React by default mindset." — Loren (via the presenter)

"If you can't do the thing without the tool, you shouldn't do the thing with the tool either. You should fix that shortcoming in your own knowledge first." — The presenter

"The worst part of defaults isn't that they slow innovation. It's that the worst developers default to them." — The presenter

"Curiosity can't be the only driver for adoption." — Chat (via the presenter)

"The problems that other frameworks solve are not big enough and common enough for most devs to care. That's the harsh reality." — The presenter

"Stability means old things still work." — The presenter

"Most devs should default to a good enough tool because most devs aren't good enough to pick well otherwise." — The presenter

"The harm comes when the best devs stop caring about these things. And that's the point we're getting to now. That is scary." — The presenter

"If React isn't innovating, why is every UI library implementing the same features that React has?" — Ricky

"Asking the average dev to think more will always fail. Always." — The presenter