Обзор

Статический рендеринг — ключевая возможность фреймворка Next.js, обеспечивающая предварительный рендеринг страниц на этапе сборки для оптимальной производительности и SEO. При таком подходе любая нативная для Next.js библиотека должна без проблем работать в этой модели рендеринга. gt-next 6.9.0 добавляет поддержку статического рендеринга, позволяя интернационализированным приложениям использовать все возможности статической генерации Next.js без ущерба для определения локали и работы переводов.

Что такое статический рендеринг?

Статический рендеринг генерирует HTML на этапе сборки, а не при каждом запросе. Хотя этот подход обеспечивает очень высокую производительность, он создает сложности для библиотек i18n, которые обычно полагаются на заголовки запроса, cookies или middleware для определения локали пользователя. При статическом рендеринге эти зависящие от запроса данные недоступны, поэтому для определения локали требуются альтернативные подходы.

Настройка статического рендеринга

Прежде чем настраивать gt-next, убедитесь, что ваше приложение Next.js подготовлено для статического рендеринга в соответствии с документацией generateStaticParams.

Настройка включает три ключевых компонента:

1. Включите статический рендеринг в конфигурации

export default withGTConfig(nextConfig, {
  experimentalEnableSSG: true,
})

2. Настройка middleware

Настройте middleware для динамических запросов:

// proxy.ts (Next.js 16+) или middleware.ts (Next.js 15 и ниже)
import { createNextMiddleware } from 'gt-next/middleware'

export default createNextMiddleware();

export const config = {
  matcher: [
    "/((?!api|static|.*\\..*|_next).*)",
  ],
}

3. Определите статическое определение локали

Создайте функцию getStaticLocale, которая определяет локаль во время статической генерации. Эта функция запускается только при статической генерации — при SSR используется поведение по умолчанию (чтение заголовков, cookies и т. д.).

Next.js 15.5+

// getStaticLocale.ts
import { locale } from "next/root-params";

export default async function getStaticLocale() {
  return await locale();
}

Next.js 15.1–15.4

// getStaticLocale.ts  
import { unstable_rootParams } from "next/server";

export default async function getStaticLocale() {
  return (await unstable_rootParams())?.locale;
}

getStaticRegion можно вызывать для кастомизации определения региона во время статической отрисовки.

Преимущества

Next.js Native: использует встроенную систему корневых параметров Next.js для совместимости со статической генерацией.

Дополнительные возможности

Помимо статической генерации, в этом релизе также появилась поддержка пользовательских функций getLocale() и getRegion(), которые можно настроить как для SSR, так и для сред статического рендеринга.