Svelte 5 runes + SvelteKit

Explicit, signal-based reactivity (runes) plus the SvelteKit data-loading contract: knowing where code runs and how load data reaches a page.

Two things break Svelte code more than anything else: treating $effect as the default for computed values, and confusing server-only load with universal load. This skill keeps you on the right side of both.

When to use

• Authoring or editing .svelte / .svelte.js / .svelte.ts files.
• Choosing $state vs $derived vs $effect; migrating Svelte 4 let / $: / export let to runes.
• Writing or reviewing +page.svelte, +page.ts, +page.server.ts, +layout*, +server.ts, +error.svelte, hooks.server.ts.
• load design (universal vs server), PageData typing, depends/invalidate, streaming promises, form actions with use:enhance.
• Remote functions (query/form/command/prerender in *.remote.ts).
• Adapter choice and SSR/CSR/prerender flags; hydration-mismatch debugging.

When NOT to use