Rendu

Par défaut, Next.js pré-rend chaque page. Cela signifie que Next.js génère le HTML pour chaque page à l'avance, plutôt que de tout faire via JavaScript côté client. Le pré-rendu peut améliorer les performances et le référencement (SEO).

Chaque HTML généré est associé au minimum de code JavaScript nécessaire pour cette page. Lorsqu'une page est chargée par le navigateur, son code JavaScript s'exécute et rend la page entièrement interactive (ce processus est appelé hydratation dans React).

Pré-rendu

Next.js propose deux formes de pré-rendu : Génération Statique et Rendu côté Serveur. La différence réside dans le moment où le HTML de la page est généré.

• Génération Statique : Le HTML est généré au moment de la construction (build time) et sera réutilisé à chaque requête.
• Rendu côté Serveur : Le HTML est généré à chaque requête.

Il est important de noter que Next.js vous permet de choisir quelle forme de pré-rendu utiliser pour chaque page. Vous pouvez créer une application Next.js "hybride" en utilisant la Génération Statique pour la plupart des pages et le Rendu côté Serveur pour d'autres.

Nous recommandons d'utiliser la Génération Statique plutôt que le Rendu côté Serveur pour des raisons de performance. Les pages générées statiquement peuvent être mises en cache par un CDN sans configuration supplémentaire pour améliorer les performances. Cependant, dans certains cas, le Rendu côté Serveur peut être la seule option.

Vous pouvez également utiliser la récupération de données côté client (client-side data fetching) conjointement avec la Génération Statique ou le Rendu côté Serveur. Cela signifie que certaines parties d'une page peuvent être rendues entièrement par JavaScript côté client. Pour en savoir plus, consultez la documentation sur la Récupération de Données.