Prerendering SvelteKit Routes for Search Engines
SvelteKit server-renders by default, so it avoids the empty-shell problem out of the box β but for routes whose content only changes at build time, prerendering to static HTML is faster and even more crawl-reliable. The skill is choosing prerender versus SSR per route and making sure prerenderable routes are discoverable. This builds on the SvelteKit SEO and routing guide and the rendering-strategy framework.
Step-by-step fix
-
Enable prerender on static routes. Export
prerenderfrom the page or layout.// src/routes/blog/[slug]/+page.js export const prerender = true; // β emit static HTML at build time -
Prerender the whole site where appropriate, or set a default in the root layout and opt specific routes out.
// src/routes/+layout.js β prerender by default export const prerender = true;// src/routes/account/+page.js β opt this dynamic route out export const prerender = false; // β stays SSR; per-user, not static -
Keep data-dependent routes on SSR. Routes reading per-request data must not be prerendered, or every visitor sees the build-time snapshot.
-
Make prerenderable routes discoverable. The crawler that generates prerendered pages follows links; ensure dynamic route entries are reachable or listed.
// svelte.config.js β seed entries the link crawler can't reach kit: { prerender: { entries: ['/blog/first-post', '/blog/second-post'] } }
Validation
- Build output contains static
.htmlfiles for prerendered routes. curlof a prerendered route returns full content and metadata.- GSC URL Inspection rendered HTML matches the live page.
- Dynamic routes still reflect fresh data and are not accidentally frozen.
Reference
// Per-route rendering intent in SvelteKit
// src/routes/+layout.js
export const prerender = true; // default: static
// src/routes/products/[id]/+page.server.js
export const prerender = false; // SSR: live inventory
export async function load({ params }) {
return { product: await getProduct(params.id) };
}
Frequently Asked Questions
Is SvelteKit server-rendered by default? Yes. SvelteKit server-renders pages by default, so content and metadata are in the response. Prerendering goes a step further for routes that do not change per request, emitting static HTML at build time for the best performance and crawl reliability.
When should I prerender a SvelteKit route instead of using SSR? Prerender routes whose content is the same for every visitor and changes only at build β marketing pages, docs, blog posts. Keep SSR for routes that depend on per-request data such as inventory or personalization.
Related
- SvelteKit SEO & Routing Guide β the full SvelteKit SEO setup.
- CSR, SSG, SSR & ISR Rendering Strategies β prerender vs SSR vs ISR.
- Dynamic Rendering & Bot Prerendering β prerendering for frameworks that donβt build it in.
β Back to SvelteKit SEO & Routing Guide