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

  1. Enable prerender on static routes. Export prerender from the page or layout.

    // src/routes/blog/[slug]/+page.js
    export const prerender = true; // βœ… emit static HTML at build time
  2. 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
  3. Keep data-dependent routes on SSR. Routes reading per-request data must not be prerendered, or every visitor sees the build-time snapshot.

  4. 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 .html files for prerendered routes.
  • curl of 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.

← Back to SvelteKit SEO & Routing Guide