Svelte 5 Released

To keep it short: The Svelte team did a remarkable job improving every aspect but preseriving the characteristics and distinctive features (fast, small, easy, elegant).

Now, where I struggled (using Svelte 5 on a business logic heavy SPA since RC in April):

Signal in general are extremly easy to use, but quite hard to track. You have to "know" or "find out" if something is reactive. Vue makes it easy with their .value API, but also not 100% foolproof.

With React: Everything is a value. Unidirectional data flows. It's very easy to follow the flow of the data.

With Angular: Data pipelines are built using RxJS. Hard to learn, but extremely powerful. You can follow the data flow quite well. Not as easy as with React, but once you are good with RxJS, still easy enough.

With Svelte 5: Runes look like values. This mental model is good enough most of the time. It's especially great in small contexts where you exactly know where your variable comes from or where everything is reactive. But Runes also behave like signals and proxies. So, you sometimes need to know exactly what is in your bag. Is it a value? A signal ($state with value or $state.raw with object or array)? A proxy ($state with array or object)? In larger contexts it gets really hard to track.

Why is Svelte still full heaven to me: I realized that Runes are just the basic building blocks. They are the common basic toolkit. I don't have to use them in large business logic areas of my apps. I can create (nominal typed, using TS of course) custom wrapper classes, e.g. to only allow signals, not proxies. This wrapper classes could disallow mutation. Passing those around makes it type safe. If I see a value, it is a value. If I see a type of my reactive wrapper class, it is reactive. Or, I can use RxJS and Svelte 5. Or I can mimic Vue's or Solid's APIs (as Rich showcased).

There's a spot in the new docs (wip) where the Svelte team is going to explain Runes. I think they're also (as other Signal experts - I hope Prof. Signal Carniato solves this for all of us :-)) working on better debugging tools.

I'm happy.

Big thanks and respect to the Svelte team.

For a framework to eat into React's usage, it needs a strong evangelist (like Facebook has been for React)

Svelte reminded me of how I got my start with coding. I love it. Refusing to learn React has cost me job opportunities but Svelte is just so much more pleasant to use and easy to grok.

I’m currently building a social network with SvelteKit and I couldn’t be happier. Excellent DX.

Lume (from Deno) is my preferred 11ty alternative.

I do something similar. State and its management lives outside the React components, which only consume this state via hooks. Keeping the state in chunks, and outside the tree lets me access a chunk of state only in the components that need it.

This results into minimum amount of re-rendering of components. Component code also looks cleaner and easier to read.