Vue d’ensemble

Ce comportement est désormais obsolète ; consultez gt-next@6.10.0 pour le nouveau fonctionnement.

Le rendu statique est une capacité fondamentale du framework Next.js : il permet de générer des pages prérendues au moment du build pour offrir des performances optimales et un bon référencement. Dans cette logique, toute bibliothèque native pour Next.js devrait s’intégrer naturellement à ce modèle de rendu. gt-next 6.9.0 introduit la prise en charge du rendu statique, permettant aux applications internationalisées de tirer pleinement parti des capacités de génération statique de Next.js sans compromettre la détection du paramètre régional ni les fonctionnalités de traduction.

Qu’est-ce que le rendu statique ?

Le rendu statique génère le HTML au moment du build, plutôt qu’à chaque requête. Bien que cette approche offre des performances exceptionnelles, elle pose des difficultés aux bibliothèques d’i18n, qui s’appuient généralement sur les en-têtes de requête, les cookies ou le middleware pour déterminer le paramètre régional de l’utilisateur. Lors du rendu statique, ces dépendances, disponibles uniquement au moment de la requête, ne le sont pas, ce qui impose d’autres approches pour détecter le paramètre régional.

Configuration du rendu statique

Avant de configurer gt-next, assurez-vous que votre application Next.js est bien configurée pour la génération statique en suivant la documentation generateStaticParams.

Cette configuration repose sur trois éléments clés :

1. Activer le rendu statique dans la configuration

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

2. Configurer le middleware

Configurez le middleware pour les requêtes dynamiques :

// proxy.ts (Next.js 16+) ou middleware.ts (Next.js 15 et versions inférieures)
import { createNextMiddleware } from 'gt-next/middleware'

export default createNextMiddleware();

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

3. Définir la détection statique du paramètre régional

Créez une fonction getStaticLocale qui détermine le paramètre régional lors du rendu statique. Cette fonction ne s’exécute que pendant la génération statique ; pendant le SSR, le comportement par défaut (lecture des en-têtes, des cookies, etc.) est utilisé.

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 peut être appelé pour personnaliser la détection de région lors du rendu statique.

Avantages

Natif pour Next.js : S'appuie sur le système intégré de paramètres racine de Next.js pour garantir la compatibilité avec le rendu statique.

Fonctionnalités supplémentaires

Au-delà de la génération statique, cette version ajoute également la prise en charge de fonctions getLocale() et getRegion() personnalisées, configurables aussi bien pour le SSR que pour les environnements de rendu statique.