Optimisations
Next.js propose une variété d'optimisations intégrées conçues pour améliorer la vitesse de votre application et les Core Web Vitals. Ce guide couvrira les optimisations que vous pouvez exploiter pour améliorer l'expérience utilisateur.
Composants intégrés
Les composants intégrés simplifient la mise en œuvre d'optimisations courantes pour l'interface utilisateur. Ces composants sont :
- Images : Basées sur l'élément natif
<img>. Le composant Image optimise les performances des images en chargeant les images de manière différée et en les redimensionnant automatiquement selon la taille de l'appareil. - Lien : Basé sur les balises
<a>natives. Le composant Link précharge les pages en arrière-plan pour des transitions plus rapides et plus fluides. - Scripts : Basés sur les balises
<script>natives. Le composant Script vous donne le contrôle sur le chargement et l'exécution des scripts tiers.
Métadonnées
Les métadonnées aident les moteurs de recherche à mieux comprendre votre contenu (ce qui peut améliorer le SEO) et vous permettent de personnaliser la présentation de votre contenu sur les réseaux sociaux, créant ainsi une expérience utilisateur plus engageante et cohérente sur différentes plateformes.
Le composant Head de Next.js vous permet de modifier le <head> d'une page. Apprenez-en plus dans la documentation du composant Head.
Ressources statiques
Le dossier /public de Next.js peut être utilisé pour servir des ressources statiques comme des images, des polices et d'autres fichiers. Les fichiers dans /public peuvent également être mis en cache par les fournisseurs de CDN pour une diffusion efficace.
Analyse et surveillance
Pour les applications volumineuses, Next.js s'intègre avec des outils d'analyse et de surveillance populaires pour vous aider à comprendre les performances de votre application. Apprenez-en plus dans les guides Analytics, OpenTelemetry, et Instrumentation.