svelte5-best-practices

SKILL.md

| Runes | $state, $derived, $effect, $props, $bindable, $inspect | runes.md | | Snippets | Replacing slots, {#snippet}, {@render} | snippets.md | | Events | onclick handlers, callback props, context API | events.md | | TypeScript | Props typing, generic components | typescript.md | | Migration | Svelte 4 to 5, stores to runes | migration.md |

| SvelteKit | Load functions, form actions, SSR, page typing | sveltekit.md | | Performance | Universal reactivity, avoiding over-reactivity, streaming | performance.md |

Svelte 5 runes, snippets, SvelteKit patterns, and modern best practices for TypeScript and component development. Use when writing, reviewing, or refactoring Svelte 5 components and SvelteKit applications. Triggers on: Svelte components, runes ($state, $derived, $effect, $props, $bindable, $inspect), snippets ({#snippet}, {@render}), event handling, SvelteKit data loading, form actions, Svelte 4 to Svelte 5 migration, store to rune migration, slots to snippets migration, TypeScript props typing, generic components, SSR state isolation, performance optimization, or component testing. Source: ejirocodes/agent-skills.

View raw