Optimisez la nouvelle métrique Interaction to Next Paint de Google

Les Core Web Vitals sont un ensemble de mesures que Google a définies pour mesurer la qualité de l’expérience utilisateur d’un site Web. Ils sont devenus un signal de classement pour la première fois en 2021.

Alors que les définitions métriques ont été modifiés au fil du tempsl’introduction de la métrique Interaction to Next Paint est le changement le plus important depuis le lancement de l’initiative Core Web Vitals.

Qu’est-ce que l’interaction avec la peinture suivante (INP) ?

Interaction avec la peinture suivante est une mesure qui évalue la rapidité avec laquelle votre site Web réagit à l’interaction de l’utilisateur. Il mesure le temps qui s’écoule entre l’entrée de l’utilisateur, comme un clic sur un bouton, et la prochaine fois que le contenu de la page est actualisé (la « prochaine peinture »).

Pour un meilleur classement dans Google, ce délai d’interaction doit être inférieur à 200 millisecondes. Cela garantit que le site Web se sent réactif aux utilisateurs.

Comment évoluent les Core Web Vitals ?

Google a annoncé que l’interaction avec Next Paint deviendra l’un des trois Core Web Vitals statistiques en mars 2024. À ce stade, un site Web qui répond trop lentement aux entrées des utilisateurs pourrait faire pire dans le classement des résultats de recherche.

L’INP remplacera l’actuel Premier délai d’entrée (FID) métrique. Bien que le FID mesure également la réactivité, il est plus limité car il ne prend en compte que la première interaction de l’utilisateur. Il ne mesure également que le délai jusqu’à ce que l’événement d’entrée commence à être traité, plutôt que d’attendre que l’utilisateur puisse voir le résultat.

Actuellement seulement 64,9 % des sites Web mobiles réussissez bien sur la métrique Interaction to Next Paint et il sera plus difficile d’obtenir un bon score INP qu’un bon score First Input Delay.

Comment puis-je mesurer la métrique Interaction to Next Paint sur mon site Web ?

Exécutez un test de vitesse de site Web pour voir à quelle vitesse votre site Web se charge et à quelle vitesse il répond aux entrées des utilisateurs.

Ouvrez l’onglet « Web Vitals » une fois votre test terminé. Vous pouvez voir la métrique Interaction to Next Paint en bas de la page.

Dans ce cas, seuls 38 % des utilisateurs ont une bonne expérience INP.

Comment puis-je optimiser l’interaction avec Next Paint ?

Les retards d’interaction se produisent lorsque le navigateur doit effectuer un grand nombre de traitements CPU avant de pouvoir mettre à jour la page. Cela peut arriver pour deux raisons :

• Les tâches d’arrière-plan continues empêchent la gestion de l’entrée de l’utilisateur
• La gestion de l’entrée de l’utilisateur elle-même prend beaucoup de temps

Les tâches en arrière-plan se produisent souvent lors du chargement initial de la page, mais peuvent également se produire plus tard. Ils sont souvent causés par un code tiers intégré sur le site Web.

Répondre à une interaction utilisateur peut nécessiter beaucoup de traitement. Si cela ne peut pas être optimisé, vous pouvez envisager d’afficher un spinner pour fournir un retour visuel jusqu’à ce que la tâche de traitement soit terminée.

L’exécution de code JavaScript est le type de traitement le plus courant, mais les mises à jour visuelles complexes peuvent également prendre beaucoup de temps.

Utiliser Chrome DevTools pour analyser les performances

Les outils de développement Chrome profileur de performances montre quelles tâches prennent beaucoup de temps et doivent être optimisées. Démarrez un enregistrement, cliquez sur un élément de la page, puis cliquez sur les barres les plus longues de la visualisation.

Cela vous permet d’identifier si le code provient d’un tiers ou de votre propre site Web. Vous pouvez également plonger plus profondément pour voir comment la tâche peut être accélérée.

Vérifiez la métrique Total Blocking Time pour identifier les tâches en arrière-plan

Le Temps total de blocage La métrique suit la fréquence à laquelle il y a des tâches CPU en arrière-plan qui pourraient empêcher l’exécution d’autres codes. Si l’utilisateur interagit avec la page alors qu’une tâche est déjà en cours, le navigateur termine d’abord cette tâche avant de gérer l’événement d’entrée.

Vous pouvez utiliser des outils comme Phare de Google pour voir comment cette métrique peut être optimisée.

Si des tâches lourdes de traitement sur votre site Web font partie du code de votre site Web principal, vous devrez travailler avec votre équipe de développement pour les optimiser. Pour les tiers, vous pouvez vérifier si le script est toujours nécessaire ou contacter le support client du fournisseur pour voir s’il est possible d’optimiser le code.

Surveiller l’interaction avec la peinture suivante

Vous voulez savoir comment vous vous débrouillez sur INP et d’autres Core Web Vitals ? DebugBear peut suivre la vitesse de votre site Web et vous aider à l’optimiser.

Commencez dès aujourd’hui un essai gratuit de 14 jours et offrez une meilleure expérience utilisateur.

Conclusion

La métrique Interaction to Next Paint représente le plus grand changement apporté aux Core Web Vitals de Google depuis leur annonce initiale. INP corrige les lacunes de la mesure précédente du premier délai d’entrée et fournit une meilleure représentation de la façon dont les utilisateurs perçoivent un site Web.

Vérifiez les performances de votre site Web sur la métrique Interaction to Next Paint avant que le changement de classement ne soit déployé en 2024. De cette façon, vous aurez amplement le temps d’identifier les optimisations et de rendre votre site Web plus rapide.

Essayez DebugBear avec un essai gratuit de 14 jours.