← Blog

React, Solid, htmx: Part 2

#Reactjs #Solidjs #htmx #web

Despite being pulled more into doing backend at work, I’ve continued following the ongoing evolution of the web frontend landscape. This is a great time to revisit one of my most popular posts on this blog, “React, Solid, htmx”.

React: Stalled paradigm shift

With the full backing of Next.js and Vercel, React finally has realized its original full stack vision. Next.js offers the "use cache" directive to support composable caching on server, and Vercel offers “Fluid compute” that benefits server rendered UI in the serverless environment, in addition to providing first-class support for hosting Next.js apps. One might say that this marks the culmination of Vercel’s multi-year support for “the future of React,” making the full-stack React architecture in Next.js App Router a truly compelling option for building real-world apps. Developers can now take advantage of the promises of server rendering without a high barrier or bill.

And yet, we haven’t seen many praises or success stories for adopting the new server-first vision. After over two years of the introduction of App router, Next.js still remains the only “mainstream” React framework to support RSC. Instead, we’re witnessing an ongoing tension between React’s server-first vision and the React community at large—from the controversial initial 19 RC release in last June (See my post “Component, colocation, composition: A note on the state of React” for more on this) to the more recent backlash against the “Sunsetting Create React App” official blog post in this February, particularly regarding its reluctance toward recommending Vite as a modern alternative to CRA. The React team responded positively to community feedback in both cases, but the growing sense of mismatch in expectations was palpable.

Meanwhile, the React community at large is experiencing a renewed appreciation of the client-first approach. Much of credit goes to React Router/Remix and TanStack, which have been perfecting both established and innovative patterns to support client-first React apps: SSR with (and without) streaming, nested routes, route-level parallel data fetching, type-safe routes and navigation, streamlined server state management, API/resource routes, and more. These patterns have proven to effectively tackle the original limitations of client-first React apps. And then there is the promise of React Compiler (currently in beta), which will only help client-first React apps to run faster.1

Instead of a paradigm shift, the server-first path to the two Reacts has become just another tool in the toolbox, and seemingly not a particularly popular one at the moment. Many are still choosing the familiar path, but who can blame them?

Solid: 2 steps ahead

Solid continued to inspire the broader web development landscape. In 2022, Preact Signals appeared. In 2023, we saw the reveal announcement of Vapor Mode in Vue as well as runes in Svelte. We also saw the preview (Angular 16) and stable release (Angular 17) of Angular Signals. In 2024, Svelte 5 with runes went live while Angular continued to iterate on its signal-based features. This momentum reached a new height with the introduction of a TC39 proposal for signals, which was revealed in April and shortly reached stage 1.

Meanwhile, Solid was not sitting idly, waiting for everyone to catch up on it. After years of deep research, the shape of an upgraded Solid reactivity has finally emerged. With createAsync, signals won’t need special signature for handling async values. With the split effect, createEffect will behave in a predictable manner even with signals holding async values. With createProjection, Solid’s reactivity will handle complex data structures more efficiently. Most importantly, all new and renewed primitives will work together to form a consistent reactivity model. So get excited: Solid 2.0 is now officially in development! Solid, one step ahead.

While researching core reactivity, Solid also reached a big milestone in 2024: the release of SolidStart 1.0. As detailed in the announcement post, “The Shape of Frameworks to Come”, SolidStart presents a uniquely modular and incremental approach to building a web framework where everything from SSR to Server Functions are totally optional. Even router, the backbone of most other frameworks, is a matter for choice in SolidStart.

Just like Solid inspired many others to adopt signals, SolidStart is already making an impact beyond the Solid ecosystem. Tanner Linsley of Tanstack, a longtime collaborator and partner in crime, is bringing the “Start philosophy” to the React world with Tanstack Start (currently in beta). I’ve covered Tanstack Start in “Two ways to the two Reacts”, focusing on its “server as a feature” approach to full-stack React, but the similarity between two Start frameworks go much deeper than that, ranging from the underlying technology stack (Vite, Nitro, Vinxi2) to the modular design with router as a separate component.3 Solid, two steps ahead.

htmx: Finished software

An isolated event may be a simple coincidence but repetition makes a pattern. In the 2024 JavaScript Rising Stars “Front-end Frameworks” category, htmx added 16.8k GitHub stars to take the top spot, leading React by over 4k stars. On Hacker News, you now can find htmx in comments on any popular post about web development. While htmx is nowhere near React or other established options (Vue, Angular, Svelte, etc.) in terms of use, it has proved to be more than just an Internet meme. No, htmx has become a proper meme, an idea infecting the minds of the web development community. Hypermedia is so back!

So what’s next for htmx? Well, that’s the neat part—not much! This is because htmx is a finished software. In a blog post “The future of htmx”, The htmx team states,

People shouldn’t feel pressure to upgrade htmx over time unless there are specific bugs that they want fixed, and they should feel comfortable that the htmx that they write in 2025 will look very similar to htmx they write in 2035 and beyond.

This is not to say that htmx’s quest for hypermedia renaissance is over—far from it! Now that it has captured everyone’s attention, htmx means to propel hypermedia forward by following in jQuery’s footsteps, a library so successful that its core features got incorporated into the JavaScript standard. At the heart of this suicide mission are the Triptych proposals, which consist of three proposals to evolve the HTML standard to

  • Support PUT, PATCH, and DELETE requests in <form>,
  • Allow <button> to issue HTTP requests, and
  • Support partial replacement.

In addition, htmx continues to promote hypermedia-oriented approaches and keep the research and discourse alive. In addition to its (in)famous online and social media presence, this effort includes presenting in conferences, appearing in interviews and podcasts, publishing on an academic journal, and creating another project showcasing what a stripped-down version of “generalized hypermedia controls” can look like.

* * *

I wrote the original “React, Solid, htmx” article out of my deep appreciation for their relentless pursuit of a clear and unique vision. I’m happy to see that React continues betting on components, Solid on primitives, and htmx on hypermedia. Regardless of where their paths lead in the future, I’m confident that React, Solid, and htmx are pushing the web forward, each in their own way.

Footnotes

  1. It is not a surprise that React Compiler was voted to be the most exciting new feature in the 2024 State of React survey, with RSC being the distant second. ↩

  2. Both Tanstack Start and SolidStart plan to drop Vinxi from dependencies and lean into leveraging Vite’s new API. ↩

  3. It took a different path, but React Router 7 also offers a similar path to incremental adoption where “framework” features can be added via a Vite plugin. ↩