Glossary · Definition
SSG
SSG (Static Site Generation) renders pages to plain HTML at build time. The output is a folder of static files servable from any web server or CDN. No database queries at request time, no server cost, no SSR latency.
Definition
SSG (Static Site Generation) renders pages to plain HTML at build time. The output is a folder of static files servable from any web server or CDN. No database queries at request time, no server cost, no SSR latency.
What it means
Build pipeline: source content (markdown, JSON, CMS) → generator (Hugo, Astro, Eleventy, Next.js export, Jekyll, Gatsby) → static HTML / CSS / JS files. Deploy: copy to any CDN-fronted static host (Vercel, Netlify, Cloudflare Pages, GitHub Pages, S3 + CloudFront). Subsequent navigation: prefetch links + client-side router give SPA-like UX while the underlying pages stay static. Modern variants: ISR (Incremental Static Regeneration — Next.js, Astro) lets you regenerate specific pages on a schedule or on-demand without a full rebuild; perfect for content that changes occasionally but doesn't need millisecond freshness.
Advertisement
Why it matters
SSG is the right answer for: content-heavy sites (blogs, docs, tool catalogs, marketing sites), anything where pages don't change per-user, sites that need to handle traffic spikes cheaply (a CDN serves static files with infinite scale), and teams that want simplest deploys. It's NOT the right answer for: heavily personalized pages (use SSR), real-time data dashboards (use client-side fetching + SPA), and apps where build times matter — generating 10,000 pages takes minutes.
Frequently asked questions
SSG vs ISR vs SSR?
SSG: built once at deploy. ISR: built once but regenerable per page on a schedule or trigger. SSR: built every request. Most large sites mix all three: marketing pages SSG, dashboards SSR, occasionally-updated content ISR.
Best SSG framework in 2026?
Astro for content-heavy sites with islands of interactivity. Next.js (export mode) if you're already on Next. Hugo for blog-style content with fastest builds. 11ty (Eleventy) for minimal-config simple sites. SvelteKit's adapter-static is a strong choice if you're on Svelte.
What about huge sites?
ISR / on-demand revalidation is the answer. A site with 10k+ pages won't rebuild every page on every commit — ISR regenerates per-page on first hit after a content update.
Related terms
- DefinitionSPAA SPA (Single-Page Application) loads one HTML page and one JS bundle, then uses JavaScript to swap content as the user navigates — no full-page reload between routes. React, Vue, Svelte, Angular all enable SPAs by default. The pattern dominated 2014-2020.
- DefinitionPWAA PWA (Progressive Web App) is a website that meets a small set of criteria — HTTPS, service worker, web app manifest — so browsers offer 'install this site' as an app. Once installed, it runs full-screen, gets a home-screen icon, and can work offline.
- DefinitionCDNA CDN (Content Delivery Network) is a globally distributed network of edge servers that cache your site's static content (HTML, CSS, JS, images, fonts) close to users so each request hits a nearby PoP instead of your origin server.