Introduction
Svelte 5 introduces Runes—compiler-driven primitives that bring explicit, fine-grained reactivity to standard JavaScript objects and variables.
React 19 vs Svelte 5 Comparison
Notice how Svelte 5 eliminates hooks, dependency arrays, and updater callbacks in favor of direct mutation:
State & Derived Calculations
Comparing React 19 useState/useMemo hooks with Svelte 5 $state and $derived runes.
❌ React 19
✨ Svelte 5 (Runes)
Interactive Rune Inspector
Test how $state mutations trigger instant derived calculations and $effect tracking in real-time below:
Interactive Svelte 5 Rune Inspector
Observe $state mutations trigger $derived signals and $effect observers
1. $state Signals
count 0
multiplier 2x
2. $derived Signals
multiplied ($derived) 0
Calculated as: 0 × 2
isEven ($derived) true
3. $effect Execution Log
No effect executions yet.