SSG (Static Site Generation)
名詞 · 網頁架構
靜態生成方法,所有 HTML 頁面在建置時預先構建,然後直接從 CDN 提供服務——實現近乎即時的載入時間,並因無需動態伺服器而增強安全性。
Next.js 採用的網頁架構,能在編譯時將動態資料(API、CMS、資料庫)轉換為靜態 HTML 檔案——結合動態網站的靈活性與靜態網站的速度。
每個頁面都是獨立 HTML 檔案的部署策略,可透過內容分發網路(CDN)在全球範圍內分發,消除對應用程式伺服器的依賴並大幅降低託管成本。
SSG(Static Site Generation,靜態網站生成)是一種網頁架構技術,所有 HTML 頁面在建置階段預先生成,甚至在使用者訪問網站之前。這些靜態 HTML 檔案隨後直接從 CDN 提供,每次請求無需任何伺服器端運算。Next.js 在這種方法上表現卓越,我們的團隊利用它來交付超快速的網站,內容即時可用且完美地被搜尋引擎收錄。
SSG 提供顯著的 SEO 優勢,因為每個頁面都是完整的 HTML 檔案,Google 機器人在首次爬取時就能完美讀取,無需執行 JavaScript。近乎即時的載入時間直接改善您的 Core Web Vitals 分數,這是 Google 的官方排名因素。我們的團隊透過 Next.js 利用 SSG,將您的內容頁面推送到搜尋結果頂部,將您的網站轉變為真正的高品質有機流量吸引器。
SSG 在建置時一次性生成 HTML 頁面,而 SSR 則在伺服器上根據每個使用者請求動態生成。SSG 更快,因為頁面是預先建好的並從 CDN 提供服務,但不太適合頻繁變更的內容。SSR 適合個性化頁面或即時資料。我們的團隊經常在同一個 Next.js 專案中結合兩種策略,根據每個頁面的需求取得兩種方法的最佳效果。
SSG 透過消除動態應用程式的典型攻擊面來增強網站安全性:沒有暴露的應用程式伺服器、沒有即時可存取的資料庫、沒有可注入的 SQL 查詢。由 CDN 提供服務的靜態 HTML 檔案不會受到常見漏洞(SQL 注入、伺服器端 XSS、暴力攻擊)的危害。我們的團隊為安全性和可靠性為首要優先的企業形象網站和機構網站推薦這種架構。
SSG 非常適合電子商務網站的產品目錄,因為產品頁面可以預先生成以實現即時載入和最佳 SEO。然而,購物車、使用者帳戶或結帳等動態頁面需要客戶端渲染(CSR)。我們的團隊使用 Next.js 設計混合架構,將 SSG 用於目錄頁面、CSR 用於互動功能,同時保證 SEO 效能和流暢的購物體驗。
ISR(Incremental Static Regeneration,增量靜態再生成)是 Next.js 提出的 SSG 進化版,允許在初始建置後單獨重新生成靜態頁面,無需重建整個網站。傳統 SSG 需要完整的重新建置才能更新內容,而 ISR 可以根據可配置的間隔在背景重新驗證頁面。我們的團隊將 ISR 用於需要頻繁更新內容的專案,同時保持靜態渲染的卓越效能。