詞彙表

SvelteKit 的核心提供了一個高度可配置的渲染引擎。本節描述討論渲染時使用的一些術語。有關設定這些選項的參考資料，請參閱上面的文件。

CSR

客戶端渲染 (CSR) 是指在網頁瀏覽器中使用 JavaScript 生成頁面內容。

在 SvelteKit 中，預設會使用客戶端渲染，但您可以使用csr = false 頁面選項來關閉 JavaScript。

水合作用

Svelte 元件會儲存一些狀態，並在狀態更新時更新 DOM。在 SSR 期間提取資料時，SvelteKit 預設會儲存此資料，並將其與伺服器渲染的 HTML 一起傳輸到客戶端。然後，可以使用該資料在客戶端初始化元件，而無需再次呼叫相同的 API 端點。Svelte 接著會檢查 DOM 是否處於預期的狀態，並在稱為水合作用的過程中附加事件監聽器。一旦元件完全水合，它們就可以像任何新建立的 Svelte 元件一樣對其屬性的變更做出反應。

在 SvelteKit 中，頁面預設會被水合，但您可以使用csr = false 頁面選項來關閉 JavaScript。

預先渲染

預先渲染表示在建置時計算頁面的內容，並儲存 HTML 以供顯示。此方法具有與傳統伺服器渲染頁面相同的優點，但避免了為每個訪客重新計算頁面，因此隨著訪客數量的增加，幾乎可以免費擴展。其缺點是建置過程更加耗費資源，並且預先渲染的內容只能透過建置和部署應用程式的新版本來更新。

並非所有頁面都可以預先渲染。基本規則是：要使內容可以預先渲染，任何兩個直接存取它的使用者都必須從伺服器獲得相同的內容，並且頁面不得包含動作。請注意，您仍然可以預先渲染基於頁面參數載入的內容，只要所有使用者都將看到相同的預先渲染內容即可。

預先渲染的頁面不限於靜態內容。如果使用者特定資料是在客戶端提取和渲染的，則可以建置個人化頁面。這會受到上述未對該內容執行 SSR 的缺點的影響。

在 SvelteKit 中，您可以使用prerender 頁面選項和 svelte.config.js 中的prerender 設定來控制預先渲染。

路由

預設情況下，當您導覽到新頁面時（透過點擊連結或使用瀏覽器的向前或向後按鈕），SvelteKit 會攔截嘗試的導覽並處理它，而不是允許瀏覽器向伺服器發送目標頁面的請求。然後，SvelteKit 將透過渲染新頁面的元件來更新客戶端上顯示的內容，而該元件又可以呼叫必要的 API 端點。這種在客戶端更新頁面以響應嘗試導覽的過程稱為客戶端路由。

在 SvelteKit 中，預設會使用客戶端路由，但您可以使用data-sveltekit-reload 來跳過它。

SPA

單頁應用程式 (SPA) 是一種應用程式，其中所有向伺服器的請求都會載入單個 HTML 檔案，然後該檔案會根據請求的 URL 在客戶端渲染請求的內容。所有導覽都在客戶端處理，稱為客戶端路由，其中每頁內容都會更新，而常見的版面元素則基本保持不變。SPA 不提供 SSR，這具有上述的缺點。然而，某些應用程式並不會受到這些缺點的太大影響，例如登入後的複雜商業應用程式，其中 SEO 並不重要，並且已知使用者將從一致的運算環境存取應用程式。

在 SvelteKit 中，您可以使用adapter-static 建置 SPA。

SSG

靜態網站產生 (SSG) 是指每個頁面都預先渲染的網站。SvelteKit 並非像某些工具那樣僅用於靜態網站產生，因此可能無法像專為此目的而建置的工具那樣有效地渲染大量頁面。然而，與大多數專用的 SSG 相比，SvelteKit 可以很好地允許在不同頁面上混合和匹配不同的渲染類型。完全預先渲染網站的一個好處是，您不需要維護或支付伺服器來執行 SSR。產生後，可以從 CDN 提供網站，從而帶來出色的「首次位元組時間」效能。這種交付模式通常稱為 JAMstack。

在 SvelteKit 中，您可以使用adapter-static 或透過在 svelte.config.js 中使用prerender 頁面選項或prerender 設定來配置每個頁面進行預先渲染，從而進行靜態網站產生。

SSR

伺服器端渲染 (SSR) 是指在伺服器上產生頁面內容。SSR 通常是 SEO 的首選。雖然有些搜尋引擎可以索引在客戶端動態產生的內容，但即使在這些情況下，也可能需要更長的時間。它還傾向於提高感知效能，並使您的應用程式在 JavaScript 失敗或停用時可以被使用者存取（這種情況發生的頻率可能比您想像的要多）。

在 SvelteKit 中，頁面預設會在伺服器端渲染。您可以使用ssr 頁面選項來停用 SSR。