Rendu (Rendering)

Par défaut, Next.js pré-rend chaque page. Cela signifie que Next.js génère le HTML pour chaque page à l'avance, au lieu de le faire entièrement 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 code JavaScript minimal nécessaire pour la page. Lorsqu'une page est chargée par le navigateur, son code JavaScript s'exécute et rend la page pleinement interactive (ce processus est appelé hydratation dans React).

Pré-rendu

Next.js propose deux formes de pré-rendu : Génération statique (Static Generation) et Rendu côté serveur (Server-side Rendering). 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 est 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 la forme de pré-rendu 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 via JavaScript côté client. Pour en savoir plus, consultez la documentation sur la Récupération de données.