From d9aed992053020e9b8f423ad93296356ebde4176 Mon Sep 17 00:00:00 2001 From: Thor Galle Date: Mon, 29 Sep 2025 17:54:30 +0200 Subject: [PATCH] docs: clarify that SSR is required for SSG with content (#14471) --- documentation/docs/20-core-concepts/40-page-options.md | 4 +++- documentation/docs/25-build-and-deploy/50-adapter-static.md | 2 ++ documentation/docs/60-appendix/60-glossary.md | 6 +++++- 3 files changed, 10 insertions(+), 2 deletions(-) diff --git a/documentation/docs/20-core-concepts/40-page-options.md b/documentation/docs/20-core-concepts/40-page-options.md index 727274c80911..2f3eefdc506c 100644 --- a/documentation/docs/20-core-concepts/40-page-options.md +++ b/documentation/docs/20-core-concepts/40-page-options.md @@ -125,7 +125,9 @@ export const ssr = false; // If both `ssr` and `csr` are `false`, nothing will be rendered! ``` -If you add `export const ssr = false` to your root `+layout.js`, your entire app will only be rendered on the client — which essentially means you turn your app into an SPA. +If you add `export const ssr = false` to your root `+layout.js`, your entire app will only be rendered on the client — which essentially means you turn your app into an [SPA](glossary#SPA). + +SvelteKit's SSR mode can also used by `adapter-static` to [prerender static page content (SSG)](adapter-static#Usage). > [!NOTE] If all your page options are boolean or string literal values, SvelteKit will evaluate them statically. If not, it will import your `+page.js` or `+layout.js` file on the server (both at build time, and at runtime if your app isn't fully static) so it can evaluate the options. In the second case, browser-only code must not run when the module is loaded. In practice, this means you should import browser-only code in your `+page.svelte` or `+layout.svelte` file instead. diff --git a/documentation/docs/25-build-and-deploy/50-adapter-static.md b/documentation/docs/25-build-and-deploy/50-adapter-static.md index 2b50d91515e3..74877a174d74 100644 --- a/documentation/docs/25-build-and-deploy/50-adapter-static.md +++ b/documentation/docs/25-build-and-deploy/50-adapter-static.md @@ -44,6 +44,8 @@ export const prerender = true; > [!NOTE] You must ensure SvelteKit's [`trailingSlash`](page-options#trailingSlash) option is set appropriately for your environment. If your host does not render `/a.html` upon receiving a request for `/a` then you will need to set `trailingSlash: 'always'` in your root layout to create `/a/index.html` instead. +> [!NOTE] `adapter-static` relies on SvelteKit's server-side rendering (SSR) features to prerender static page content in the build phase. If SSR is disabled on a page, the `prerender` option will only generate an empty 'shell' page for it. To prerender content on pages, you just ensure they have SSR enabled, i.e. they should _not_ have the page option [`ssr`](page-options#ssr) set to `false` in their page & layout ancestry. + ## Zero-config support Some platforms have zero-config support (more to come in future): diff --git a/documentation/docs/60-appendix/60-glossary.md b/documentation/docs/60-appendix/60-glossary.md index 25f300918ec2..99b72d7929a9 100644 --- a/documentation/docs/60-appendix/60-glossary.md +++ b/documentation/docs/60-appendix/60-glossary.md @@ -42,6 +42,8 @@ Pre-rendered pages are not limited to static content. You can build personalized In SvelteKit, you can control prerendering with [the `prerender` page option](page-options#prerender) and [`prerender` config](configuration#prerender) in `svelte.config.js`. +If you are prerendering all your pages, you are doing [Static Site Generation](#SSG). + ## PWA A progressive web app (PWA) is an app that's built using web APIs and technologies, but functions like a mobile or desktop app. Sites served as [PWAs can be installed](https://web.dev/learn/pwa/installation), allowing you to add a shortcut to the application on your launcher, home screen, or start menu. Many PWAs will utilize [service workers](service-workers) to build offline capabilities. @@ -62,7 +64,9 @@ In SvelteKit, you can [build SPAs with `adapter-static`](single-page-apps). Static Site Generation (SSG) is a term that refers to a site where every page is prerendered. One benefit of fully prerendering a site is that you do not need to maintain or pay for servers to perform SSR. Once generated, the site can be served from CDNs, leading to great “time to first byte” performance. This delivery model is often referred to as JAMstack. -In SvelteKit, you can do static site generation by using [`adapter-static`](adapter-static) or by configuring every page to be prerendered using [the `prerender` page option](page-options#prerender) or [`prerender` config](configuration#prerender) in `svelte.config.js`. +In SvelteKit, you can do static site generation by using [`adapter-static`](adapter-static) or by configuring every page to be [prerendered](#prerendering) using [the `prerender` page option](page-options#prerender) or [`prerender` config](configuration#prerender) in `svelte.config.js`. + +Note that you will probably want to keep the `ssr` page option enabled to ensure that [content is pre-rendered in the build phase](adapter-static#Usage). ## SSR