Qu'est-ce que le Lazy Loading?
Le lazy loading est une technique qui retarde le chargement des images et vidéos jusqu'à ce qu'elles soient visibles à l'écran.
Le lazy loading (chargement différé) est une technique d'optimisation qui retarde le chargement des ressources non critiques (images, vidéos, iframes) jusqu'à ce qu'elles soient sur le point d'apparaître dans la fenêtre de visualisation.
Comment ça marche?
Au lieu de charger toutes les images d'une page en même temps, seules celles visibles à l'écran sont chargées. Les autres se chargent quand l'utilisateur fait défiler la page.
Implémentation
Avantages
- ●Réduit le temps de chargement initial
- ●Économise la bande passante
- ●Améliore le LCP et les Core Web Vitals
- ●Meilleure expérience sur mobile
Attention
- ●Ne pas lazy-load les images au-dessus de la ligne de flottaison (above the fold)
- ●Toujours définir des dimensions (width/height) pour éviter le CLS
Impact SEO
Le lazy loading améliore directement les Core Web Vitals, qui sont un facteur de classement Google.
Termes connexes
Qu'est-ce que les Core Web Vitals?
Les Core Web Vitals sont 3 métriques Google mesurant la vitesse, la réactivité et la stabilité visuelle d'une page web.
Qu'est-ce que le CLS (Cumulative Layout Shift)?
Le CLS mesure la stabilité visuelle d'une page. Un mauvais CLS signifie que les éléments bougent pendant le chargement.
Qu'est-ce que le LCP (Largest Contentful Paint)?
Le LCP mesure le temps de chargement du plus grand élément visible d'une page. Objectif : moins de 2.5 secondes.
Qu'est-ce que la Vitesse de Chargement?
La vitesse de chargement mesure le temps nécessaire pour afficher complètement une page web. C'est un facteur de classement Google.
Qu'est-ce que Google Lighthouse?
Lighthouse est un outil Google qui audite la performance, l'accessibilité, le SEO et les bonnes pratiques d'une page web.
Qu'est-ce que le TBT (Total Blocking Time)?
Le TBT mesure le temps total pendant lequel la page est bloquée et ne répond pas aux interactions utilisateur.