Cum funcționează revalidarea la cerere (ISR)?

Question

Accepted Answer

**Revalidarea la cerere** vă permite să invalidați paginile în cache/statice **exact atunci când datele se modifică** — în loc să așteptați un interval bazat pe timp. Este complementul precis al ISR bazat pe timp (`revalidate: N`).

## Bazat pe timp vs la cerere

```tsx
// Time-based: page refreshes on a fixed schedule (may serve stale data up to N seconds)
export const revalidate = 3600; // every hour

// On-demand: refresh the INSTANT the underlying data changes — no waiting, no waste
```

ISR bazat pe timp este simplu, dar imperfect: prea scurt = regenerare inutilă; prea lung = conținut expirat. La cerere remediază aceasta prin declanșarea revalidării din codul propriu atunci când o schimbare se produce efectiv.

## Cele două API-uri la cerere

```tsx
import { revalidatePath, revalidateTag } from "next/cache";

// 1. Tag your fetches, then invalidate by tag
await fetch("https://api/posts", { next: { tags: ["posts"] } });
revalidateTag("posts");      // refresh EVERY page/fetch tagged "posts"

// 2. Or invalidate a specific path
revalidatePath("/blog/my-post");
```

## Un flux de lucru real: webhook CMS

```ts
// app/api/revalidate/route.ts — called by your CMS when an editor publishes
import { revalidateTag } from "next/cache";
import { NextRequest, NextResponse } from "next/server";

export async function POST(req: NextRequest) {
  const secret = req.nextUrl.searchParams.get("secret");
  if (secret !== process.env.REVALIDATE_SECRET) {       // verify it's really your CMS
    return NextResponse.json({ ok: false }, { status: 401 });
  }
  revalidateTag("posts");                                // rebuild affected pages now
  return NextResponse.json({ revalidated: true });
}
```

Fluxul: editor publică în CMS → CMS apelează webhook-ul tău → `revalidateTag("posts")` invalidează cache-ul → următorul vizitator primește HTML static proaspăt generat. Paginile rămân rapid-statice **și** se actualizează imediat la publicare.

## După o mutație Server Action

```tsx
"use server";
export async function createPost(data) {
  await db.post.create({ data });
  revalidateTag("posts"); // user sees their new post immediately
}
```

## De ce acest lucru contează

Revalidarea la cerere vă oferă cel mai bun din ambele lumi: **performanță statică cu prospețime în timp real**.

În loc să ghiciți un interval de revalidare, invalidați precis atunci când conținutul se modifică — prin webhook-uri (publicare CMS) sau după mutații Server Action — utilizând `revalidateTag`/`revalidatePath`.

Eliminând atât conținutul expirat, cât și regenerarea excesivă risipă, ISR-ul devine practic pentru conținut care se actualizează în mod imprevizibil.