Svelte 5 runes, component patterns, reactivity, and SvelteKit data loading best practices
99
99%
Does it follow best practices?
Impact
99%
1.11xAverage score across 10 eval scenarios
Passed
No known issues
{
"instruction": "Use SvelteKit load functions, form actions, and Svelte 5 $props() for page data",
"relevant_when": "Agent builds a SvelteKit application with data loading or form handling",
"context": "SvelteKit uses +page.server.ts load functions for server-side data fetching and form actions for mutations. In Svelte 5, page components receive data via $props() (not export let). Forms use use:enhance for progressive enhancement, fail() for validation errors, and redirect(303) on success.",
"sources": [
{
"type": "file",
"filename": "skills/svelte-best-practices/SKILL.md",
"tile": "tessl-labs/svelte-best-practices@0.1.4"
}
],
"checklist": [
{
"name": "load-function-in-server-file",
"rule": "Agent creates +page.server.ts with typed load functions (PageServerLoad from './$types') for server-side data fetching",
"relevant_when": "Agent builds SvelteKit pages that need data"
},
{
"name": "page-data-via-$props",
"rule": "Agent receives page data using let { data }: { data: PageData } = $props() in Svelte 5 (not export let data)",
"relevant_when": "Agent creates SvelteKit page components in Svelte 5"
},
{
"name": "form-actions-for-mutations",
"rule": "Agent uses SvelteKit form actions with fail() for errors and redirect(303) on success",
"relevant_when": "Agent implements form submissions in SvelteKit"
},
{
"name": "use-enhance-on-forms",
"rule": "Agent imports enhance from '$app/forms' and uses use:enhance on form elements",
"relevant_when": "Agent creates forms in SvelteKit"
},
{
"name": "form-data-via-$props",
"rule": "Agent receives form action data using let { form }: { form: ActionData } = $props() in Svelte 5",
"relevant_when": "Agent creates SvelteKit form pages in Svelte 5"
},
{
"name": "error-handling-in-load",
"rule": "Agent throws error() from '@sveltejs/kit' when fetch responses are not ok in load functions",
"relevant_when": "Agent implements data loading that can fail"
}
]
}evals
scenario-1
scenario-2
scenario-3
scenario-4
scenario-5
scenario-6
scenario-7
scenario-8
skills
svelte-best-practices