Next.js — отличный выбор для большинства проектов, но под нагрузкой выявляются узкие места, которые не заметны при 100 посетителях в день. Расскажем, что мы делаем для проектов, где ожидается 10 000+ одновременных пользователей.
Первое решение — правильный выбор рендеринга. SSR (Server-Side Rendering) — враг highload: каждый запрос требует вычислений на сервере. Для страниц, которые одинаковы для всех пользователей (лендинги, каталоги), используйте SSG (Static Site Generation) или ISR (Incremental Static Regeneration) с revalidate. SSR оставляйте только там, где контент действительно персонализирован.
Кеширование — второй ключевой уровень. В Next.js 14+ появился мощный data cache с тегами. Тегируйте кеш по сущностям: `revalidateTag('products')` после обновления товара — и весь кеш продуктов инвалидируется мгновенно. Для API-запросов добавляйте `Cache-Control: s-maxage=60, stale-while-revalidate` — это даёт CDN инструкцию кешировать ответ на 60 секунд.
CDN — не опция, а необходимость. Vercel Edge Network справляется хорошо, но для СНГ-трафика часто лучше комбинировать с Cloudflare. Images оптимизируйте через next/image с правильными sizes и priority для above-fold контента. Это даст 20–40% прироста LCP.
На уровне инфраструктуры: не держите базу данных на одном сервере с приложением. Используйте connection pooling (PgBouncer для PostgreSQL). Мониторинг — обязательно: Sentry для ошибок, Grafana + Prometheus для метрик. Автоскейлинг настройте на CPU > 70% — до этого порога Next.js справляется одним инстансом лучше, чем несколькими неоптимально настроенными.
Расскажите о задаче — получите развёрнутое предложение в течение 24 часов.