Lazy loading
Définition
Que veut dire
Lazy loading
?
La définition technique
Le lazy loading est une stratégie de chargement différé qui utilise l'attribut HTML loading="lazy" ou l'API Intersection Observer pour ne charger les ressources que lorsqu'elles entrent dans le viewport.
En clair
Au lieu de charger les 50 images de votre page d'un coup, le lazy loading ne charge que celles visibles à l'écran. Les autres se chargent au fur et à mesure du scroll. Le site se charge plus vite.
Lazy loading vs Eager loading
- Eager loading : tout est chargé immédiatement. Simple mais lent sur les pages lourdes.
- Lazy loading : chargement progressif. Plus rapide au premier affichage.
Dans Webflow
Webflow propose le lazy loading natif sur les images. Il suffit de l'activer dans les paramètres de chaque image. Attention à ne PAS l'activer sur les images above the fold.
Les questions en lien avec ce terme.
Faut-il activer le lazy loading sur toutes les images ?
Non. Les images above the fold (visibles sans scroller) doivent se charger immédiatement (eager). Le lazy loading ne s'applique qu'aux images en-dessous du fold.
Le lazy loading impacte-t-il le SEO ?
Non, si c'est bien implémenté. Google est capable de crawler les images en lazy loading. L'impact positif sur les Core Web Vitals compense largement.
Comment activer le lazy loading sur Webflow ?
Dans les paramètres de l'image, choisir "Lazy" dans le champ Loading. Pour les iframes et vidéos, il faut ajouter l'attribut manuellement via du custom code.
Le lazy loading est-il activé par défaut sur Webflow ?
Non. Il faut l'activer manuellement sur chaque image. C'est une étape souvent oubliée qui peut améliorer significativement les Core Web Vitals.
