SvelteKit has a distinctive file-based routing system with specialised vocabulary. Understanding how to discuss layouts, load functions, and form actions in English is key for technical interviews and team discussions.
0 / 5 completed
1 / 5
A SvelteKit developer says: 'Put shared UI in a layout file.' What does this mean?
In SvelteKit, +layout.svelte files wrap all sibling and child routes with shared UI. A layout at src/routes/+layout.svelte wraps the entire application; one at src/routes/dashboard/+layout.svelte wraps only dashboard routes. Child content renders inside a <slot />. This is how you share navbars, sidebars, and footers without repeating markup.
2 / 5
A developer says: 'Fetch the data in the load function, not in onMount.' Why?
SvelteKit's load function (exported from +page.server.ts or +page.ts) runs on the server before rendering, enabling SSR. Data is available on first paint. onMount runs client-side after mount — using it for data fetching means a blank initial render followed by a fetch. In SvelteKit, 'use the load function' is the standard advice for page data that should be available immediately.
3 / 5
In a PR: 'This is a form action — use the +page.server.ts action export.' What is a form action in SvelteKit?
SvelteKit actions in +page.server.ts handle HTML form submissions server-side. You export an actions object with handler functions: export const actions = { default: async ({ request }) => { ... } }. This approach works without JavaScript (progressive enhancement). In design discussions: 'use a form action' means handle the mutation server-side rather than via a client-side API call.
4 / 5
A developer mentions SSR vs CSR for a SvelteKit page. What do these abbreviations mean?
SSR (Server-Side Rendering) means the HTML is generated on the server for each request — good for SEO and initial load. CSR (Client-Side Rendering) means the browser renders the page using JavaScript. SvelteKit defaults to SSR but you can opt out with export const ssr = false. These terms appear constantly in architecture discussions about performance, SEO, and data freshness.
5 / 5
A SvelteKit developer says: 'Use a preload link strategy for faster navigation.' What does this mean?
SvelteKit's preloading fetches a route's data and code before the user clicks — triggered on hover or focus. This makes navigation feel instant. You enable it with data-sveltekit-preload-data='hover' on a link or in a layout. In performance discussions: 'add preloading' means improve perceived navigation speed by pre-fetching route data before the user commits to the click.