intermediate

SSR и SSG

Осознанно выбирайте server rendering, static generation, hybrid rendering, кэширование и границы hydration.

Nuxt рендерит на сервере (SSR), предсобирает при build (SSG/prerender) или гидрирует client-only SPA. `routeRules` и prerender Nitro настраивают поведение по пути.

| Режим | Первый байт | Актуальность | Хостинг | |-------|-------------|--------------|---------| | SSR | HTML с сервера на запрос | Высокая | Нужен Node/server | | SSG | Статический HTML при build | Устаревает до rebuild | CDN | | SPA | Shell + client fetch | На клиенте | Простой static host |

Hydration подключает клиентский Vue к server HTML — рассинхрон даёт warnings и сломанный UI. browser-only API — через `import.meta.client` или `onMounted`.

На интервью: когда hybrid rules лучше глобального SSR, кэш CDN vs server, hydration boundary для виджетов с `window`.

Типовые ошибки: Date/random в SSR markup, сторонние скрипты меняют DOM до hydrate, отключение SSR без оценки SEO.

Компромисс: более свежий server HTML и SEO против стоимости хостинга и сложности hydration.

Чеклист:

  • Режим под маршрут и продукт.
  • Детерминированный SSR markup.
  • client-only виджеты отложить.
  • TTFB и LCP по режимам.