Next.js: Основы App Router — как это работает на практике

Question

Accepted Answer

Каждый component — Server Component, пока не помечен иначе. Сервер рендерит tree → **RSC payload** (compact React tree description, не HTML) → stream → client reconcile. Navigation — новый RSC payload, patch tree без full reload.

## Разбор

`<Link>` — client navigation + **prefetch** routes in viewport (production) — payload часто уже в memory при click. Отсюда «instant» feel при server-render.

Segment config — **exported constants**, не config file:

```ts
export const dynamic = 'force-dynamic';   // opt the whole segment out of static
export const revalidate = 3600;           // ISR: re-generate at most hourly
export const runtime = 'edge';            // or 'nodejs' (default)
```

Next 15: `cookies()`, `headers()`, `params`, `searchParams` — **async**, `await` их; touch = static → dynamic flip.

## Итог

App Router mechanics: RSC payload streaming, Link prefetch, segment exports; dynamic APIs async в Next 15 — ключ к static vs dynamic routing.