Google Chrome teste une nouvelle façon de mesurer les Core Web Vitals dans les applications à page unique (SPA), ce qui constitue un angle mort de longue date dans le suivi des performances qui affecte les audits SEO et les signaux de classement.

À partir de Chrome 139, les développeurs peuvent opter pour un essai d’origine pour l’API Soft Navigations. Cela permet de mesurer des métriques telles que LCP, CLS et INP même lorsqu’une page met à jour le contenu sans rechargement complet.

Pourquoi c’est important pour le référencement

Les SPA sont populaires pour leur rapidité et leur interactivité, mais ils sont notoirement difficiles à surveiller à l’aide d’outils tels que Lighthouse, de données de terrain dans CrUX ou de véritables scripts de surveillance des utilisateurs.

En effet, les SPA mettent souvent à jour la page à l’aide de JavaScript sans déclencher une navigation traditionnelle. Par conséquent, les systèmes de mesure de Google et la plupart des outils de performance ne tiennent pas compte de ces mises à jour lors du calcul des Core Web Vitals.

Cette nouvelle API vise à combler cet écart, en vous donnant une image plus claire des performances de votre site dans le monde réel, en particulier après qu’un utilisateur a cliqué ou navigué dans une interface de type application.

Ce que fait la nouvelle API

L’API Soft Navigations de Chrome utilise des heuristiques intégrées pour détecter le moment où une navigation logicielle se produit. Par exemple:

  • Un utilisateur clique sur un lien
  • L’URL de la page est mise à jour
  • Le DOM change visiblement et déclenche un paint

Lorsque ces conditions sont remplies, Chrome le traite désormais comme un événement de navigation pour mesurer les performances, même si aucun chargement de page complète n’a eu lieu.

L’API introduit de nouvelles mesures et améliorations, notamment :

  • interaction-contentful-paint – vous permet de mesurer la plus grande peinture de contenu après une navigation douce
  • navigationId – ajouté aux entrées de performances afin que les métriques puissent être liées à des navigations spécifiques (crucial lorsque les URL changent en cours d’interaction)
  • Extensions à changement de disposition, timing de l’événementet INP travailler à travers des navigations douces

Comment l’essayer

Vous pouvez tester cette fonctionnalité aujourd’hui dans Chrome 139 en utilisant soit :

  • Tests locaux: Activer chrome://flags/#soft-navigation-heuristics
  • Essai d’origine: Ajoutez un jeton à votre site via une balise méta ou un en-tête HTTP pour collecter des données utilisateur réelles

Chrome recommande d’activer l’indicateur « Advanced Paint Attribution » pour les données les plus complètes.

Choses à garder à l’esprit

Barry Pollard de Chrome, qui dirige cette initiative, souligne que l’API est encore expérimentale :

« Voulez-vous mesurer les Core Web Vitals pour les SPA ?

Eh bien, nous avons travaillé sur l’API Soft Navigations pour cela et nous lançons un nouvel essai d’origine à partir de Chrome 139.

Essayez-le sur votre application et voyez s’il détecte correctement les navigations logicielles sur votre application et faites-nous savoir si ce n’est pas le cas !

Voici ce que vous devez savoir d’autre :

  • Les métriques peuvent ne pas être prises en charge dans les anciennes versions de Chrome ou dans d’autres navigateurs
  • Votre fournisseur de RUM devra peut-être prendre en charge navigationId et interaction-contentful-paintpour le suivi
  • Certains cas extrêmes, comme les redirections automatiques ou replaceState() utilisation, ne peut pas être enregistré en tant que navigation

Regarder vers l’avenir

Cet essai est une étape vers une amélioration de la précision des Core Web Vitals pour les sites Web modernes utilisant beaucoup de JavaScript.

Bien que l’API ne soit pas encore intégrée aux rapports de performances publics de Chrome comme CrUX, cela pourrait changer si l’essai s’avère concluant.

Si votre site s’appuie sur React, Vue, Angular ou d’autres frameworks SPA, c’est maintenant votre chance de tester dans quelle mesure la nouvelle approche de Chrome capture l’expérience utilisateur.