Comment Lighthouse calcule votre score de performances global
En général, seules les metrics contribuent à votre score de performances Lighthouse, pas aux résultats des opportunités ou des diagnostics. Cela dit, l'amélioration des opportunités et des diagnostics améliore probablement les valeurs des métriques. Il existe donc une relation indirecte.
Vous trouverez ci-dessous les raisons pour lesquelles le score peut fluctuer, la façon dont il est composé et le score utilisé par Lighthouse pour chaque métrique.
Pourquoi votre taux varie-t-il ?
La variabilité de votre score de performances global et des valeurs des métriques n'est en grande partie pas due à Lighthouse. Les fluctuations de votre score de performances s'expliquent généralement par l'évolution des conditions sous-jacentes. Voici quelques problèmes courants:
- Tests A/B ou modifications des annonces diffusées
- Modifications du routage du trafic Internet
- Tests sur différents appareils, par exemple un ordinateur de bureau hautes performances et un ordinateur portable peu performant
- Extensions de navigateur qui injectent du code JavaScript et ajoutent/modifient des requêtes réseau
- Logiciel antivirus
La documentation de Lighthouse sur la variabilité aborde ce sujet plus en détail.
De plus, même si Lighthouse peut vous fournir un seul score de performances global, il peut être plus utile de considérer les performances de votre site comme une répartition des scores plutôt que comme un nombre unique. Pour en comprendre la raison, consultez l'introduction des métriques de performances axées sur l'utilisateur.
Comment le score de performances est-il pondéré ?
Le score de performance correspond à la moyenne pondérée des scores de métriques. Naturellement, les métriques plus pondérées ont un impact plus important sur votre score de performances global. Les scores des métriques ne sont pas visibles dans le rapport, mais sont calculés en arrière-plan.
![Application Web du calculateur d'évaluation Lighthouse](https://developer.chrome.com/static/docs/lighthouse/performance/performance-scoring/image/lighthouse-scoring-calcul-196f49058e387.png?authuser=6&hl=fr)
Lighthouse 10
Audit | Poids |
---|---|
First Contentful Paint | 10 % |
Indice de vitesse | 10 % |
Largest Contentful Paint | 25 % |
Total Blocking Time | 30% |
Cumulative Layout Shift | 25 % |
Lighthouse 8
Audit | Poids |
---|---|
First Contentful Paint | 10 % |
Indice de vitesse | 10 % |
Largest Contentful Paint | 25 % |
Délai avant interactivité | 10 % |
Total Blocking Time | 30% |
Cumulative Layout Shift | 15% |
Comment les scores des métriques sont-ils déterminés ?
Une fois que Lighthouse a collecté les métriques de performances (principalement en millisecondes), il convertit chaque valeur de métrique brute en un score de métrique de 0 à 100 en examinant où se situe la valeur de la métrique dans la répartition de ses scores Lighthouse. La répartition des scores est une répartition log-normale dérivée des métriques de performances des données de performances réelles du site Web sur HTTP Archive.
Par exemple, le LCP (Largest Contentful Paint) mesure lorsqu'un utilisateur perçoit que le contenu le plus volumineux d'une page est visible. La valeur de la métrique pour le LCP représente le temps écoulé entre le moment où l'utilisateur lance le chargement de la page et celui qui affiche son contenu principal. D'après les données réelles des sites Web, les sites les plus performants affichent le LCP en 1 220 ms environ. Cette valeur de métrique est donc associée à un score de 99.
Pour aller un peu plus loin, le modèle de courbe d'évaluation Lighthouse utilise les données HTTPArchive pour déterminer deux points de contrôle qui définissent ensuite la forme d'une courbe log-normal. Le 25e centile des données HTTPArchive devient un score de 50 (point de contrôle médian) et le 8e centile devient un score de 90 (point de contrôle correct/vert). En explorant le graphique de la courbe d'évaluation ci-dessous, notez qu'entre 0,50 et 0,92, il existe une relation quasi linéaire entre la valeur de la métrique et le score. Comme ci-dessus, un score de 0,96 correspond au "point de rendement décroissant", mais la courbe s'éloigne, ce qui nécessite de plus en plus d'améliorer les métriques pour améliorer un score déjà élevé.
![Image de la courbe d'évaluation pour l'indice de satisfaction](https://developer.chrome.com/static/docs/lighthouse/performance/performance-scoring/image/image-the-scoring-curve-f72983bc008e4.png?authuser=6&hl=fr)
Gestion des ordinateurs par rapport aux mobiles
Comme indiqué ci-dessus, les courbes de score sont déterminées à partir de données de performances réelles. Avant la version 6 de Lighthouse, toutes les courbes de score étaient basées sur les données de performances sur mobile, même si une exécution de Lighthouse l'utilisait. En pratique, cela a entraîné une augmentation artificielle des scores sur les ordinateurs. Lighthouse v6 a corrigé ce bug en utilisant un système d'évaluation spécifique sur ordinateur. Vous pouvez certainement vous attendre à des variations globales de votre score de performances sur une échelle de 5 à 6, mais les scores sur ordinateur seront très différents.
Comment les scores sont-ils codés par couleur ?
Les scores des métriques et le score de performance sont colorés en fonction des plages suivantes:
- 0 à 49 (rouge): faible
- 50 à 89 (orange): amélioration nécessaire
- 90 à 100 (vert): bon
Pour offrir une expérience utilisateur de qualité, les sites doivent s'efforcer d'obtenir un bon score (90-100). Un score "parfait" de 100 est extrêmement difficile à atteindre, et nous ne nous y attendons pas. Par exemple, prendre un score de 99 à 100 nécessite à peu près le même niveau d'amélioration des métriques qu'un score de 90 à 94.
Que peuvent faire les développeurs pour améliorer leur score de performances ?
Commencez par utiliser le calculateur d'évaluation Lighthouse pour déterminer les seuils à atteindre pour atteindre un certain score de performances Lighthouse.
Dans le rapport Lighthouse, la section Opportunités contient des suggestions détaillées et de la documentation sur la façon de les mettre en œuvre. De plus, la section Diagnostic contient des conseils supplémentaires que les développeurs peuvent consulter pour améliorer davantage leurs performances.