Svelte vs React - first impressions
My journey through preferred frontend frameworks looks like this:
- Prototype.js and MooTools
- Backbone.js with Marionette
- Angular (for half a year or so)
- React or Preact (last five years now)
- Next.js with React
And now there is a new kind of player in town. Svelte solves the problem of rendering by moving work from the browser (what React and Vue do) to a compile step to optimize for performance and file size.
Let's take a look at the experience of Svelte so far.
Svelte defines itself as a
Component Framework and does not rely on the virtual DOM for diffing before rendering, but instead builds the app (or component) with the ability to precisely updates the DOM. This comes with the upside of great performance.
Svelte runs at build time, converting your components into highly efficient imperative code that surgically updates the DOM
Having just started out I already appreciate these parts of the framework a lot:
- Animations - adding that extra UX delight is easy to do and great support is included
export-ing stuff in a natural way is great
- Documentation - it wouldn't get the adoption it has if it wasn't for the docs and tutorials
- Less code - I haven't measured it yet, but I'm convinced I'm writing less code with Svelte
Going back to bindings and the way template syntax feels familiar from Angular which I think is a part of the reason you don't have to write as much code as with React.
I haven't gotten to deploy anything yet, but I spent a couple of evenings experimenting with it. In fact, if it wasn't for
Next.js (which covers a bigger scope and feature set) and
Now I would probably jump straight to Svelte.