Pourquoi charger tout de suite une image qui se trouve tout en bas d’un article, que le visiteur ne verra peut-être jamais ? Le chargement différé retarde ce téléchargement jusqu’au moment où l’élément approche réellement de la zone visible à l’écran.
Activé nativement dans WordPress
Depuis la version 5.5, WordPress ajoute automatiquement l’attribut loading="lazy" aux balises <img> et <iframe> du contenu, via la fonction wp_lazy_loading_enabled. Ce comportement peut être désactivé pour un cas précis avec le filtre du même nom, une pratique recommandée pour l’image la plus visible en haut de page, celle qui détermine souvent le LCP.
Exemple
add_filter('wp_lazy_loading_enabled', function ($default, $tag_name, $context) {
if ('the_content' === $context && 'img' === $tag_name) {
return false;
}
return $default;
}, 10, 3);
Ce filtre désactive le chargement différé uniquement pour les images du contenu principal, un réglage à manier avec précaution plutôt qu’à appliquer globalement.
Piège fréquent
- Appliquer le chargement différé à l’image la plus grande visible immédiatement au chargement (souvent liée au LCP) retarde son affichage au lieu de l’accélérer : c’est l’exact opposé de l’effet recherché.
- Un carrousel ou une galerie mal configurée peut afficher des espaces vides le temps que les images différées se chargent, un défaut d’expérience utilisateur à surveiller.
- Le chargement différé ne s’applique pas automatiquement aux images de fond définies en CSS (
background-image) : une gestion spécifique en JavaScript est nécessaire pour ce cas.