Svelte 5 brings improvements under the hood—namely functional components and the adoption of signals—but is otherwise a mostly incremental update. The one exception is the new Runes feature, which introduces a host of ideas for dealing with reactivity in a more modular, succinct, and fine-grained way.
In this article, you'll get a hands-on introduction to the main runes shipping with Svelte 5: $state()
, $derived()
, $props()
, $inspectI()
, and $effect().
Runes in Svelte
At first glance, it might seem that the new runes feature adds complexity to working with Svelte. In fact, this idea offers a simpler approach to doing many things you likely already do. The term rune refers to a magical glyph, or an alphabetic letter with mysterious powers. In Svelte, runes are special tokens that tell the Svelte compiler to work behind the scenes in specific ways to make things happen.
To read this article in full, please click here