SSG
Static Site Generation
ELI5 — The Vibe Check
SSG builds all your pages ahead of time — before anyone visits. You get a folder of plain HTML files that are blazing fast to serve from a CDN. The downside: you have to rebuild whenever content changes. Perfect for blogs, docs, and marketing sites.
Real Talk
SSG pre-renders pages at build time, producing static HTML, CSS, and JS files that can be deployed to a CDN. Because there's no server processing per request, it's extremely fast and cheap to host. Best for content that doesn't change per user or very frequently.
Show Me The Code
// Nuxt SSG — nuxt generate
// Builds every page to static HTML at build time
// Deploy the output/ folder to any static host
When You'll Hear This
"Our marketing site uses SSG — it deploys to Vercel as static files." / "SSG can't show personalized content without client-side fetching."
Related Terms
CSR (Client-Side Rendering)
CSR means the browser downloads a mostly-empty HTML page plus a big JavaScript bundle, then builds the full page in the browser.
Hydration
Hydration is when a server-rendered HTML page comes alive in the browser.
ISR (Incremental Static Regeneration)
ISR is the best of both SSG and SSR. Pages are pre-built statically but can automatically rebuild themselves in the background after a set time.
Next.js
Next.js is React's big sibling that adds superpowers like SSR, SSG, file-based routing, and API routes.
Nuxt
Nuxt is Vue on steroids. It's a meta-framework that adds SSR, SSG, file-based routing, auto-imports, and a full deployment pipeline on top of Vue.
SPA (Single Page Application)
A SPA is a website that loads ONE HTML page and then never does a full page reload again.