Publié le 16 juillet 2021, modifié le 18 avril 2024 par Lucie Blanchard

WordPress a publié un article dans sa section développeur proposant d’affiner le comportement de chargement paresseux par défaut de WordPress. Les tests ont révélé que le changement proposé améliorait une métrique de performance Core Web Vitals d’une moyenne médiane de 7 % à 33 %.

    :
  • WordPress propose un moyen d\'améliorer considérablement la plus grande peinture de contenu pour les sites WordPress
  • Le contrôle fin de l\'attribut de chargement paresseux appartient aux développeurs de thèmes
  • La proposition prévoit d\'omettre le chargement différé sur la première image ou iframe du code, ce qui peut augmenter la métrique Core Web Vitals d\'une moyenne médiane de 7 à 33%
  • La sortie du plugin officiel est prévue avec WordPress 5.9 en décembre 2021

Proposition pour améliorer Core Web Vitals dans WordPress

La proposition indique que le contrôle fin de l’attribut de chargement paresseux appartient aux développeurs de thèmes.

Cela dit, il a été constaté qu’en affinant la façon dont le chargement paresseux est ajouté par défaut, des améliorations significatives ont été apportées à la métrique Core Web Vitals appelée Largest Contentful Paint.

Voici comment la proposition décrit l’amélioration  :

« Au lieu de charger par défaut toutes les images et tous les iframes, la toute première image de contenu (en tenant compte également des images présentées) ou le contenu iframe ne doit pas être chargé paresseux.

Il s’agit d’une valeur par défaut plus sensible que celle utilisée par la mise en œuvre actuelle, qui, en moyenne et à grande échelle, se traduira par de meilleures performances LCP prêtes à l’emploi, tout en maintenant la bande passante nécessaire faible.

Publicité

Continuer la lecture ci-dessous

En utilisant le chargement différé, des éléments tels que des images qui ne sont pas visibles sur l’écran du navigateur du visiteur du site peuvent être retardés à l’aide d’un attribut HTML appelé attribut de chargement.

Une image est un élément HTML de page Web.

Un attribut HTML est un code qui modifie un élément HTML, comme une image.

L’attribut loading modifie l’image, dans ce cas, en indiquant au navigateur de retarder son téléchargement.

L’attribut de chargement indique au navigateur de retarder le téléchargement d’une image, ce qui permet au navigateur de télécharger des éléments de page plus importants qui sont immédiatement visibles par le visiteur du site Web.

Cela rend la page interactive plus rapidement pour le visiteur du site.

La plus grande peinture de contenu (LCP) mesure la vitesse à laquelle l’image et d’autres éléments se téléchargent dans la fenêtre d’affichage des visiteurs du site (l’écran du navigateur que le visiteur voit).

Publicité

Continuer la lecture ci-dessous

Une image est généralement codée en HTML comme ceci :

L’ajout de lazy load consiste simplement à ajouter l’attribut HTML lazy load  :

Comment WordPress 5.9 peut améliorer la plus grande peinture de contenu

Le développeur qui a publié la proposition d’amélioration de LCP a noté qu’à partir de WordPress 5.5, le code de base ajoutait l’attribut de chargement paresseux par défaut à toutes les images et iframes.

Mais ce n’est pas idéal car les images en haut de la page, comme les logos et les images en vedette, doivent être téléchargées pour que la page Web devienne utilisable.

WordPress a implémenté le chargement paresseux comme celui-ci car il n’avait aucun moyen d’exclure avec précision les images les plus importantes de la réception de l’attribut de chargement paresseux.

La raison en est que tous les thèmes sont codés différemment et que ce type d’exclusion granulaire est mieux fait par les développeurs de thèmes pour cette raison.

Bien que l’implémentation actuelle du chargement paresseux par défaut sur WordPress n’était pas idéale, l’ajout du chargement paresseux de cette manière est une nette amélioration par rapport à l’absence d’ajout de l’attribut de chargement du tout.

Ce qui est proposé représente une nette amélioration comme le démontrent les résultats des tests énumérés ci-dessous.

En rapport: Advanced Core Web Vitals  : un guide technique de référencement

Comment WordPress améliorera la plus grande peinture de contenu

Ce que l’équipe de développeurs WordPress propose, c’est d’exclure l’ajout de l’attribut de chargement paresseux à la première image ou iframe du code.

Le développeur a testé cette méthode sur les 50 thèmes WordPress les plus populaires et a découvert que son ajout au premier élément d’image ou d’iframe permettait une amélioration moyenne du score LCP Core Web Vitals de 7 % en moyenne.

Le développeur a ensuite testé dans quelle mesure LCP s’est amélioré en ajoutant un chargement paresseux à deux éléments. Les gains de performances ont chuté en moyenne de 2 %, ce qui montre clairement que l’exclusion du chargement différé de plusieurs éléments n’améliore pas davantage le LCP.

Voici quelques-unes des conclusions  :

« Le fait d’omettre la première image de contenu d’être chargée paresseux a entraîné une amélioration médiane du LCP de 7 % (1 877 ms contre 2 020 ms avec le comportement de base actuel) et une augmentation médiane des octets d’image de 0 % (368 Ko par rapport à 369 Ko avec le comportement de base actuel ). → L’omission de la première image de contenu entraîne clairement une amélioration du LCP tout en ne régressant pas sensiblement sur les octets d’image enregistrés.

L’omission des deux premières images de contenu du chargement paresseux a entraîné une amélioration médiane du LCP de 5 % (1 927 ms contre 2 020 ms avec le comportement de base actuel) et une augmentation médiane des octets d’image de 2 % (378 Ko par rapport à 369 Ko avec le comportement de base actuel ). → Omettre les deux premières images de contenu produit de moins bons résultats pour les deux métriques que d’omettre uniquement la première, c’est-à-dire qu’il est préférable de ne sauter que le lazy-loading pour la première image de contenu, et donc pas de tests supplémentaires avec un plus grand nombre d’images n’étant pas paresseuses. chargement sont nécessaires.

Publicité

Continuer la lecture ci-dessous

Nouveaux résultats du test de chargement paresseux WordPress

  • 5 % des thèmes du groupe de test ont obtenu des scores LCP allant de 10 % pires à 21 % pires
  • 42% des thèmes ont amélioré les scores LCP de 10% à 33% de mieux
  • Les tests ont révélé que les avantages étaient meilleurs pour la majorité des thèmes testés

Selon la proposition WordPress :

« Alors que l’amélioration médiane du LCP sur tous les thèmes n’est que de 7 %, il existe des gains notables plus importants pour un nombre important de thèmes, tandis que les pertes notables sont minimes. »

En rapport: 18 plugins WordPress qui accéléreront votre site

Qwanturankr crée un plug-in de preuve de concept

Un committer WordPress Core a créé un correctif de preuve de concept (POC) sous forme de plugin, vraisemblablement à des fins de débogage et l’a publié sur GitHub.

Ce n’est pas une version officielle du plugin WordPress, il n’est donc pas conseillé de se précipiter et de l’installer.

Les versions officielles des plugins sont publiées dans le référentiel de plugins WordPress.

Quand le chargement paresseux raffiné arrivera-t-il ?

La chronologie de l’amélioration du comportement de chargement paresseux est actuellement définie pour WordPress 5.9.

WordPress 5.9 devrait actuellement sortir en décembre 2021.

Publicité

Continuer la lecture ci-dessous

La proposition pour la fonctionnalité améliorée de chargement paresseux est actuellement en cours de discussion et a jusqu’à présent rencontré une réponse positive dans les commentaires.

Donc, à moins qu’un problème actuellement imprévu ne survienne, il est très possible que des scores améliorés de la plus grande peinture à contenu soient disponibles sur les sites WordPress plus tard cette année.

Citations

OAnnonce officielle de la proposition WordPress

Affiner la mise en œuvre du chargement paresseux de WordPress Core

Page WordPress GitHub pour l’amélioration du chargement paresseux

Omettre l’attribut de chargement paresseux sur la première image/iframe de contenu

FAQ

Qu'est-ce que Core web vitals wordpress ?

Core web vitals est une nouvelle mesure de performance pour les sites web développée par Google. Elle se concentre sur trois critères importants pour l'expérience utilisateur : le temps de chargement, l'interactivité et la stabilité du contenu visuel.

Cette initiative vise à améliorer la qualité des pages web et à offrir une meilleure expérience aux utilisateurs. Les propriétaires de sites WordPress devront donc prendre en compte ces critères lors du développement et de la gestion de leur site pour rester compétitifs sur les moteurs de recherche.

Quel est le plug-in de Core web vitals pour WordPress ?

Le plug-in de Core web vitals pour WordPress est un outil essentiel pour suivre les performances en termes de vitesse, d'interactivité et de stabilité d'un site web. Grâce à cet ajout, les utilisateurs peuvent facilement identifier les éléments à améliorer pour offrir une expérience utilisateur optimale sur leur site WordPress. Ce plug-in fournit également des données clés telles que le temps de chargement et la stabilité du contenu afin de garantir une bonne visibilité sur les moteurs de recherche.

Pourquoi l'évaluation de Core web vitals a-t-elle échoué sur WordPress ?

L'évaluation de Core web vitals a échoué sur WordPress en raison de plusieurs raisons. Tout d'abord, les sites WordPress ont tendance à être plus chargés avec des thèmes et des plugins, ce qui peut affecter les performances du site et impacter négativement les mesures essentielles proposées par Google.

Deuxièmement, les utilisateurs de WordPress peuvent ne pas avoir une connaissance approfondie en développement web pour optimiser correctement leur site selon ces critères. Enfin, certaines fonctionnalités telles que le contenu généré dynamiquement peuvent également influencer négativement l'évaluation de la vitesse et de l'expérience utilisateur globale du site sur WordPress.

Qu'est-ce que Web-vitals ?

Web-vitals décrit un ensemble de métriques essentielles pour mesurer les performances et l'expérience utilisateur d'un site web. Ces indicateurs permettent d'évaluer la vitesse de chargement, la stabilité et l'interactivité d'une page. Ils sont pris en compte par Google pour classer les sites dans ses résultats de recherche et influencent donc directement le référencement naturel des pages.

Pour les propriétaires de sites, surveiller et améliorer ces web-vitals est donc crucial pour offrir une expérience optimale à leurs utilisateurs et être bien positionné sur le web.

Vital Free Press en ligne existe-t-il ?

Oui, Vital Free Press existe en ligne sous forme de site internet. Il s'agit d'un média d'information généraliste qui couvre l'actualité nationale et internationale ainsi que des sujets variés tels que la politique, l'économie ou encore la culture.

Son contenu est gratuit et accessible à tous les lecteurs du monde entier. Le journal en ligne propose également des articles d'opinion et des analyses approfondies pour permettre une meilleure compréhension des événements majeurs.

Categories: IA

Lucie Blanchard

Lucie Blanchard

S’abonner
Notification pour
guest

Commentaires
Commentaires en ligne
Afficher tous les commentaires
0
Nous aimerions avoir votre avis, veuillez laisser un commentaire.x