Outils d'optimisation des performances en 2024 et au-delà

Depuis près de 15 ans, le panneau "Performances" de Chrome DevTools aide les développeurs à mesurer et optimiser leurs performances d'exécution sous une forme ou une autre. Il s'agissait d'un panneau intitulé "Chronologie", qui a évolué pour devenir le panneau "Performances" que vous connaissez aujourd'hui.

Au fil du temps, Chrome a lancé d'autres produits et fonctionnalités performants. Notamment, Lighthouse a été lancé en 2016 pour vous aider à identifier plus facilement les opportunités d'optimisation. Le panneau "Informations sur les performances" expérimental a été lancé en 2022 pour tester de nouvelles façons de présenter des insights sur les performances.

Le panneau "Performances" regorge de données et de fonctionnalités pour aider les développeurs à analyser en détail les problèmes de chargement de page et de performances d'exécution. Mais soyons réalistes et reconnaissons qu'il peut être difficile à utiliser et à identifier les meilleures opportunités d'améliorer les performances des pages. De plus, les fonctionnalités d'autres outils qui aident à trier le bruit et à identifier rapidement les opportunités (comme Lighthouse) ne sont pas disponibles dans le panneau "Performances".

Afin de permettre aux développeurs d'identifier et de reproduire plus facilement les problèmes de performances, nous allons intégrer les fonctionnalités et les enseignements de Lighthouse et du panneau "Informations sur les performances" au panneau "Performances" existant. Nous nous concentrons également sur l'expérience utilisateur et la facilité d'utilisation pour améliorer l'efficacité du panneau "Performances" en tant qu'outil d'optimisation des performances Web.

Quel est le résultat ? Un seul panneau, plus simple et plus puissant que jamais, pour toutes les données et insights sur les performances.

Prendre des mesures en fonction des performances Web, c'est facile

Vos commentaires confirment que la forte densité d'informations aggrave les problèmes d'usabilité. Nous développons activement des correctifs et des fonctionnalités pour vous aider. Les principaux parcours d'optimisation, comme l'amélioration des métriques Core Web Vitals, bénéficient d'un traitement de premier ordre. Nous prévoyons d'ajouter des fonctionnalités telles que les annotations, qui vous permettront de marquer des résultats et de partager vos apprentissages avec vos collègues. En affichant les corrélations dans les données, vous pourrez mieux comprendre un système complexe. Vous aurez ainsi plus de moyens de révéler la façon dont les données sont liées, comme les requêtes réseau à l'activité du thread principal.

Nous déploierons de nouvelles fonctionnalités à mesure que nous les développerons et nous vous tiendrons informés des nouvelles fonctionnalités proposées par le panneau tous les quelques mois. Veuillez patienter Vous verrez bientôt les nouvelles fonctionnalités.

Le potentiel de Lighthouse, dans le panneau "Performances"

Nous avons vu comment les développeurs utilisent à la fois les panneaux Lighthouse et Performances. Le changement de contexte entre les deux est un défi. De plus, pour prendre des mesures en fonction des résultats de Lighthouse, vous devrez peut-être accéder au panneau "Performances" afin d'obtenir plus de contexte. Cela crée des frictions, car la vue d'ensemble prescriptive des performances d'une page est distincte des données de performances détaillées.

Nous allons intégrer en profondeur l'analyse des performances de Lighthouse via le panneau "Performances". Grâce à cette intégration, Lighthouse met en avant les principales opportunités d'amélioration des performances des pages dans le panneau "Performances", avec tous les détails nécessaires pour les exploiter.

Une fois toutes les fonctionnalités de performances transférées dans le panneau "Performances", le panneau Lighthouse indépendant de DevTools deviendra redondant et sera abandonné. L'abandon de ce panneau ne sera pas effectif avant le second semestre 2025. Il est important de préciser que Lighthouse ne disparaîtra pas.

Capture d'écran du panneau "Performances" avec le logo Lighthouse

Lighthouse est là pour durer

Le module npm Lighthouse et le rapport Lighthouse dans PageSpeed Insights (y compris l'API PSI) ne seront pas abandonnés. Nous restons attachés à la disponibilité et à la qualité de Lighthouse en tant qu'outil Open Source pouvant être utilisé dans l'environnement de prédilection du développeur pour évaluer les performances des pages.

Cette intégration nous permet d'améliorer à la fois le panneau "Performances" et les fonctionnalités de Lighthouse pour les développeurs qui tentent de raisonner sur le chargement, la réactivité et la stabilité du contenu.

Abandon du panneau "Informations sur les performances" expérimental

Le panneau "Insights sur les performances" a été publié à titre expérimental afin de voir comment nous pourrions mieux répondre à trois problèmes clés: réduire la densité d'informations du panneau "Performances", prendre en charge l'analyse basée sur les cas d'utilisation et réduire la courbe d'apprentissage associée à l'utilisation du panneau "Performances".

Les commentaires des développeurs nous ont beaucoup appris sur ce test. Nous avons confirmé que l'analyse basée sur les cas d'utilisation (par exemple, "Je souhaite optimiser le LCP" ou "Je souhaite optimiser les pages pour qu'elles soient plus réactives") est extrêmement utile, et que des fonctionnalités telles que le suivi des changements de mise en page facilitent le diagnostic et l'amélioration des métriques.

Les développeurs ont également trouvé le panneau "Insights sur les performances" plus accessible que le panneau "Performances", ce qui confirme que la densité d'informations réduite est attrayante. Cependant, cette densité réduite a souvent un coût, car les développeurs doivent accéder au panneau "Performances" pour obtenir les données détaillées nécessaires à l'action.

Nos enseignements et de nombreuses fonctionnalités du panneau "Informations sur les performances" expérimental seront intégrés au panneau "Performances". Des fonctionnalités telles que l'analyse basée sur les cas d'utilisation et l'amélioration de la densité des informations, ainsi que l'intégration de Lighthouse, nous aideront à rendre les insights sur les performances des pages plus exploitables que jamais.

Le test "Informations sur les performances" sera supprimé plus tard en 2024.

Où envoyer vos commentaires ?

Nous vous invitons à nous faire part de vos commentaires à mesure que nous déployons de nouvelles fonctionnalités. Si vous avez des idées pour améliorer les fonctionnalités ajoutées ou si votre flux actuel dans le panneau est trop perturbé, n'hésitez pas à nous en faire part. Nous souhaitons connaître les fonctionnalités qui vous sont utiles et celles que nous pourrions améliorer. Merci !