Static Site Generation

The page is rendered once at build time and saved to disk. Every subsequent visitor gets the exact same HTML. There's no server work and no database query, it's as fast as serving a JPEG.

Built atSSG

2026-05-05T12:37:16.043Z

In production, this value never changes between deploys. Refresh, it stays put. Compare it to the SSR demo, where the timestamp changes on every reload.

What happens

Build, Next.js runs the page once. The output HTML is written into the build artifact.
Deploy, the static file is uploaded to a CDN edge.
Request,the CDN returns the cached file. The origin server isn't touched.
Hydrate, JS arrives, interactivity (if any) wires up.

The code

ssg/page.tsx

// app/rendering/ssg/page.tsx
"use cache";
import { cacheLife } from "next/cache";

export default async function Page() {
  cacheLife("max"); // 30-day revalidate, 1-year expire, effectively static
  const builtAt = new Date().toISOString();
  return <span>{builtAt}</span>;
}

The "use cache" directive is what tells Next.js to prerender this page. Without it, under cacheComponents mode, every page is dynamic by default.

Trade-offs

Good: cheapest, fastest, infinitely scalable. Perfect for marketing pages, docs, archived blog posts.
Bad: data is frozen until you redeploy. Not suitable for anything personalised or rapidly changing.