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
{
"context": "Tests whether the agent builds a Svelte 5 data table component using parameterized snippets for row rendering, the children/named snippet pattern with $props() and the Snippet type import, $state.raw() for API-fetched data, and correct TypeScript patterns throughout.",
"type": "weighted_checklist",
"checklist": [
{
"name": "Parameterized snippet",
"description": "Uses a snippet with a parameter to let the parent control per-row rendering, e.g. {#snippet row(item)} or similar pattern where the snippet accepts an argument",
"max_score": 20
},
{
"name": "Snippet type import",
"description": "Imports the Snippet type from 'svelte' in the table component (import type { Snippet } from 'svelte')",
"max_score": 10
},
{
"name": "@render for snippet invocation",
"description": "Uses {@render snippetName(args)} syntax to render snippets inside the component, not <slot>",
"max_score": 10
},
{
"name": "No <slot> usage",
"description": "Does NOT use any <slot> or <slot name=...> elements — uses snippet props exclusively for composition",
"max_score": 10
},
{
"name": "$state.raw for fetched data",
"description": "Uses $state.raw() (not plain $state()) to store the fetched rows/items list that comes from an API call or JSON import",
"max_score": 15
},
{
"name": "$props() not export let",
"description": "No 'export let' appears anywhere — all props declared via $props() destructuring",
"max_score": 10
},
{
"name": "children or named snippet prop",
"description": "The component declares snippet props (children or a named snippet) in its $props() destructuring with Snippet type annotations",
"max_score": 10
},
{
"name": "No on: event directive",
"description": "Does NOT use on:click or any other on: event directives — uses onclick etc. attribute syntax",
"max_score": 5
},
{
"name": "lang=ts on scripts",
"description": "All <script> blocks have lang=\"ts\"",
"max_score": 5
},
{
"name": "No $: reactive declarations",
"description": "No $: syntax — uses $derived or $derived.by for any computed values",
"max_score": 5
}
]
}evals
scenario-1
scenario-2
scenario-3
scenario-4
scenario-5
scenario-6
scenario-7
scenario-8
skills
svelte-best-practices