Suggest an edit

Improve this article

Refine the answer for “What is SSG in Next JS?”. Your changes go to moderation before they’re published.

Approval required

Content

What you’re changing

Title (EN)

Short answer (EN)

Shown above the full answer for quick recall.

Answer (EN)

**SSG (Static Site Generation)** in **Next.js** is a rendering method where **HTML pages are generated ahead of time, at build time**, and served to users as **ready-made static files**.

## How SSG works

1. You run `next build`
2. Next.js **renders the page once**
3. The ready HTML is saved
4. On request:
  - **there is no server**
  - the file is served instantly (often through a CDN)

```
build time → HTML → CDN → user
```

---

## When SSG is used

SSG is used when:

- data **does not depend on the user**
- content **rarely changes**
- **speed and SEO** matter

Typical cases:

- landing pages
- documentation
- a blog
- reference pages
- public roadmaps

---

## SSG example in the App Router

```ts
// app/blog/page.tsx
export const dynamic = "force-static";

export default async function Page() {
  const posts = await getPosts(); // runs at build time
  return <PostsList posts={posts} />;
}
```

Or through `fetch`:

```ts
await fetch("https://api.example.com/posts", {
  cache: "force-cache", // default → SSG
});
```

---

## Pros of SSG

- maximum speed
- excellent SEO
- minimal server load
- cheap hosting
- ideal for a CDN

---

## Cons of SSG

- data **does not update** without a rebuild
- content cannot be personalized
- not suited for auth / user data

---

## SSG vs SSR

|  | SSG | SSR |
|---|---|---|
| When it renders | build time | request time |
| Speed | Very high | High |
| SEO | Excellent | Excellent |
| Freshness | No | Yes |
| Server | not needed | needed |

---

## SSG is not just "pure static"

In Next.js, SSG easily extends into **ISR**:

```ts
export const revalidate = 60;
```

The page:

- stays static
- **updates in the background** once every 60 seconds

Markdown · drag & drop images · ⌘B / ⌘I shortcuts312 words

For the reviewer

Note to the moderator (optional)

Visible only to the moderator. Helps review go faster.