Updated: You can find the previous examples on the legacy branch
A extensive comparison of modern frontend frameworks, by building the same App three times using the same tools an libraries.
The following frameworks are being compared:
The objective is to build a simple Pokedex App using PokeApi as a backend.
Here the respective repos:
My personal ranking:
- Nuxt
- Astro
- Next.js
- SvelteKit
Nuxt was the clear winner in my experience. It hat overall better structure, development features and ease of use. I'm amazed that a small team from France did a better job at building an open source framework with a polished build tool than the highly capitalized company Vercel behind Next.js.
I liked Astro due to it's simplicity, it feels like a JAMSTACK tool for React. Kind of what Gatsby was supposed to be, only much better developer experience. There are however certain use cases where I'd stay away, particularly when it comes to executing CRUD operation on complex data structures. It's great for read-only (publishing).
Next.js for me was somewhere in the middle. I've worked with Next.js many times before, within a three year period, the framework changed multiple times beyond recognition. I feel like its' core developers are more focussed on releasing new features, than evaluating what actually works and doesn't and changing things accordingly. You can build apps with Next, I don't like it however, it's much more cumbersome than it should be.
Svelte/SvelteKit comes last for me. This is less a criticism of the framework itself, more of the lack of community an features. The developer experience is quite good, but having only approximately 1% of stackoverflow posts, available developers and plugins as compared to the React ecosystem, make it a tough sell. I would refrain from using this on production apps, that actually need to be maintained for many years to come.