# A Svelte and SvelteKit Checklist — Svelte / SvelteKit

Source: https://www.skillbyai.com/en/svelte/p-check

> Review before shipping.

## Questions to ask

Is state declared with runes, with derived values in `$derived` and effects reserved for external side effects? Are lists keyed? Do components use callback props and snippets rather than deprecated patterns in new code? Is per-user state kept out of module singletons on the server? Does every secret live in `$lib/server` or private `$env` modules? Do forms validate on the server and work without JavaScript? Are rendering options and the adapter right for each route and the host? Do `svelte-check`, Vitest and Playwright run in CI? Are errors handled with `+error.svelte` and logged in `handleError`?

## The checklist

Use it in reviews.

```javascript
/*
[ ] Svelte 5 runes: $state / $derived; $effect only for external side effects
[ ] keyed {#each} blocks; $state.raw for large replaced data
[ ] callback props + snippets in new components (no createEventDispatcher / slots)
[ ] no per-user data in module-level state on the server; use context or load data
[ ] secrets only in $lib/server and $env/*/private; PUBLIC_ prefix for client values
[ ] form actions validate server-side; fail(400) for user errors; use:enhance on top
[ ] hooks.server.ts sets locals.user; authorisation checked in every load/action/endpoint
[ ] +error.svelte pages; handleError logs unexpected errors
[ ] prerender / ssr / csr chosen per route; correct adapter for the host
[ ] npm run check (svelte-check), Vitest and Playwright in CI
*/
```

## Migrate gradually

Svelte 5 still compiles most Svelte 4 components, and the sv migrate command can update syntax. Convert components as you touch them rather than in one big change; check the docs for your version.

**Quiz:** Which item belongs on a SvelteKit production checklist?

- [ ] Import $env/static/private in client components
- [ ] Store per-user data in module-level $state on the server
- [x] Form actions validate input on the server even if the browser validates too
- [ ] Use $effect to compute every derived value

*Answer:* Form actions validate input on the server even if the browser validates too. Server validation and safe state handling come first.
