As a full stack dev with huge amount of experience under my belt, I feel like I have come full circle in the web development world. I started out with .NET starting with web forms, then MVC frameworks to SPA frameworks like Angular & then React, & in recent years Next.js which goes back to Server Side Rendering.
Although I have spent a lot of time developing front-ends with React & loved working with it, I feel it is at a stage where it has become too complicated as its time has passed and it is trying to continuously evolve due to modern architecture demands.
Next.js was great in the early days until I started having issues with re-hydrating server side data for the client, still haven't found a trivial solution for this. I am not comfortable using too much magic like React Query, I have used Redux in most of my apps in the past but with Server Side rendering & hydration it seems a bit overkill.
So late last year I started looking at a lot of the promising new frameworks that have popped up. In order to excel at SSR most of the new frameworks have a Meta portion to it, just like Next.js is trying to be for React.
My considerations were:
- I need less worries about re-renders. Potentially fine grained reactivity should take care of this.
- I need trivial SSR/SSG from the framework.
- No partial or full hydration headaches, when to hydrate on the server so the app passes on the data to client code.
- Dont need third party packages to monitor, fetch update data. I like less magic.
- Fast rendering with good lighthouse scores.
- Coding experience closer to vanilla JavaScript/TypeScript paradigms.
Following is a brief list of frameworks I have come across: (Please keep in mind as I have not completely explored all aspects of these frameworks so I may miss features)
Qwik is a framework that I have been impressed with as it delivers constant minimal JavaScript on first load & then lazy loads JS via web workers. It has Reactivity which means it updates injected variables without the need for re-renders. It also has a meta portion called QwikCity providing server functions SSR & SSG & does not require hydration as it has resumeablility. The syntax and concepts are very much like React so it is comfortable to pick up. The last time I looked they had some breaking changes & I feel it is not ready for prime time yet.
SolidJs is another great framework that has react like syntax, fine grained Reactivity & fast rendering so theoretically less worries about changing state and no worries about re-renders. It has a meta framework called SolidStart that provides server functions & server side rendering as well apart from plethora of other features. However SolidStart is in early development as well. I have heard issues about passing reactive variables to child components that dont get them updated.
There are people who swear by Svelte & SvelteKit.
It is the one that started fine grained reactivity trend. It is fast and compiles the code to delivery efficient JS at compile time. SvelteKit is the meta framework for Svelte that provides runtime for Svelte applications. With increasing application size however the size of the build increases.Astro is another extremely popular website build tool.
To me it seems more like other meta frameworks that is popularizing the islands architecture. It is efficient in rendering fast static content at runtime and only fetching javaScript for islands as they are required. On top of this it allows one to bring their own view library in it like React, SolidJs, Svelte etc.
All the above frameworks / libraries / tools are very promising however my vast experience with the react.js eco system tells me its never a bed or roses. So I am undecided as to which one of these technologies I should invest my time in for a deep dive that will be a good investment.
If you were in my shoes what would you do, please provide your feedback in the comments section.
Latest comments (2)
All of your choices are great, but it really depends on what you want to build, as neither one is a silver bullet. If you have a lot of static stuff, Astro and Qwik can shine. If you have lots of reactive interactions, Solid.js might be the best choice (though Solid Start, Solid's equivalent of SvelteKit, is still in beta). If you need something in between, Svelte is a good fit. But even if you choose something else, all of them will work.