Comprendre les audits de vitesse de site Web

Chez Eastside Co, nous concevons et construisons certains des meilleurs sites Web Shopify et Shopify Plus au monde. Nous veillons à ce que l'expérience utilisateur soit optimale - et un élément clé de cela est de comprendre les performances du site Web et ce à quoi ressemble le "bon". Il existe de nombreux types d'audit de site Web, l'audit de vitesse étant l'un d'entre eux.

Cet article vise à expliquer comment fonctionnent les audits de vitesse des sites Web.

Tout d'abord, commençons par la raison pour laquelle vous effectueriez un audit de vitesse. L'objectif est simple : dans quelle mesure votre site Web se chargera-t-il pour les visiteurs utilisant une variété d'appareils ? La réalisation d'un audit de vitesse efficace identifiera la vitesse de chargement et vous donnera des indications sur la façon de le rendre plus rapide. (N'oubliez pas de consulter notre article détaillé sur les moyens d'augmenter la vitesse de votre site Shopify une fois que vous avez effectué votre audit.)

Un audit de vitesse montrera une comparaison entre la façon dont votre site Web se charge sur ordinateur et sur mobile. Mais il y a quelques mises en garde importantes à garder à l'esprit.

Le pouvoir d'exécuter un audit de vitesse

L'exécution d'un audit de la vitesse du site Web à partir de votre ordinateur portable donnera des résultats trompeurs. Ou ce sera le cas si Lighthouse est installé et que vous espérez des données en temps réel.

Tout d'abord, de nombreux facteurs doivent être pris en compte lors de l'exécution d'un audit. Il y a une ventilation des mythes communs à venir dans un instant. Mais d'abord, le pouvoir d'exécuter l'audit est quelque chose à garder à l'esprit.

Vous pouvez compter sur PageSpeed ​​Insights (PSI) comme outil d'audit de vitesse. Vous pourriez. Mais il y a un facteur clé à retenir :

PSI ne capturera pas les goulots d'étranglement du monde réel. Ou mesurer par rapport aux indicateurs clés de performance (KPI) de la page du monde réel

PSI est un environnement simulé permettant de déboguer les problèmes de performances.

Pour trouver des goulots d'étranglement réels et des KPI de page, vous avez besoin d'un outil comme Google Lighthouse. Mais vous avez également besoin du matériel pour l'exécuter.

Bien que vous puissiez installer Lighthouse sur votre ordinateur portable/de bureau, les scores métriques que vous récupérez seront faibles. En effet, Lighthouse utilise des algorithmes de limitation pour créer des goulots d'étranglement et une latence de réseau réels.

Cela demande beaucoup de puissance de traitement de la part du matériel qui l'exécute. C'est pourquoi, chez Eastside Co, nous utilisons un serveur d'audit dédié. Il dispose d'une grande puissance de traitement pour exécuter des audits avec tous les étranglements que Google peut lui infliger.

Un mot sur les résultats PSI

PageSpeed ​​Insights (PSI) de Google est un outil populaire. Il utilise Lighthouse (également un outil Google) pour exécuter l'audit. Mais gardez à l'esprit qu'il le fait dans un environnement simulé.

Il y a une discussion détaillée des mesures de performance et de leur signification à venir. Tout d'abord, abordons ces mythes sur les résultats du PSI :

• L'expérience utilisateur provient d'une seule métrique : non, ce n'est pas le cas. Vous auriez besoin d'évaluer les métriques à partir d'une multitude de valeurs et non d'une seule fois.

• Vous pouvez définir un utilisateur représentatif : encore une fois, non. Les utilisateurs visiteront votre site Web à partir d'une variété d'appareils et de connexions réseau.

• Votre site Web se charge rapidement pour vous, il le sera donc pour tout le monde : non, ce n'est pas vrai. La latence du réseau et la vitesse du réseau sont deux choses qui peuvent changer l'expérience d'un utilisateur.

Les données de performance collectées sont de deux types : les données de laboratoire et les données de terrain.

Données de laboratoire

Les données de laboratoire (produites par PSI) sont des données de performance provenant d'un environnement contrôlé. Il utilise des préréglages pour les paramètres du réseau et de l'appareil. L'idée est que vous obtiendrez un ensemble de données reproductibles à des fins de débogage.

Données de terrain

Les données de champ sont des données de performances collectées à partir des chargements de page réels. Il s'agit donc de données que vos utilisateurs rencontrent en termes réels.

La principale différence est la suivante : les données de laboratoire produites par PSI ont une gamme de mesures plus large. Les données de terrain sont plus limitées, mais constituent une véritable expérience utilisateur.

Mesures de performances décodées

Il y a quelques points clés à comprendre avant d'aborder les scores métriques et leur signification.

Pourquoi les scores fluctuent

Lighthouse montrera des fluctuations dans les résultats d'un audit. Il y a des raisons à cela et elles n'ont rien à voir avec Lighthouse lui-même.

• Les annonces diffusées changent. Si vous diffusez des publicités sur votre site Web ou si vous exécutez des tests A/B, cela entraînera des écarts de performances.

• Modifications du routage du trafic Internet. L'itinéraire vers le site Web lui-même à travers le réseau peut changer.

• Changements dans le matériel utilisé. Un ordinateur de bureau puissant par rapport à un appareil mobile.

• Les logiciels antivirus peuvent entraîner des demandes de bande passante. Cela entraînera des fluctuations des résultats d'audit.

• Toutes les extensions de navigateur qui injectent du JavaScript dans la page.

Pondération

Les métriques utilisent une moyenne pondérée intégrée aux algorithmes Lighthouse. Ces pondérations ne sont pas visibles dans le rapport. Ils fournissent une mesure équilibrée de la perception des performances par les utilisateurs. Cela vient des recherches régulières de l'équipe Lighthouse.

Les métriques

Nous pouvons maintenant parcourir les métriques de niveau supérieur pour décoder ce qu'elles signifient :

First contentful paint (FCP) - cette métrique mesure le temps nécessaire au chargement du texte au-dessus de la ligne de flottaison. C'est le contenu que vous voyez sans avoir besoin de faire défiler. Trop de polices et de gros fichiers de polices affecteront ce score. Comme cela ralentira le chargement des polices à partir de ressources externes.

Indice de vitesse (SI) - cette mesure enregistre les changements visuels au-dessus de la ligne de flottaison. Cela signifie que les vidéos et les images de héros affectent toutes le score de l'indice de vitesse.

La plus grande peinture de contenu (LCP) - cette métrique recherche la plus grande image ou le plus grand bloc de texte. Il mesure le temps nécessaire pour charger cet élément dans la fenêtre. Il peut s'agir d'une image de héros ou d'une grande section de texte.

Temps d'interactivité (TTI) - cette métrique mesure le temps qu'il faut pour que la page soit prête pour l'entrée de l'utilisateur. Les applications à chargement tardif et les scripts de suivi ou d'analyse affecteront cette métrique.

Temps de blocage total (TBT) - cette métrique est comme TTI. Mais il mesure le temps total de blocage sur la page. Cela fait référence à l'impossibilité pour l'utilisateur de cliquer sur des éléments ou de faire défiler la page.

Décalage de mise en page cumulé (CLS) - cette métrique mesure la stabilité visuelle. en d'autres termes, il mesure à quel point le contenu se déplace au fur et à mesure que la page se charge, ce qui rend difficile la lecture ou l'affichage du contenu.

Enfin...

Les principaux points concernant les audits de vitesse de site Web sont les suivants : il existe des données de laboratoire et des données de terrain. Où les données de laboratoire sont un environnement simulé et les données de terrain sont une expérience utilisateur en temps réel. Pour exécuter Lighthouse afin de voir les données de terrain, vous avez besoin que la machine hôte ait autant de puissance de traitement que possible. Les données de laboratoire de PSI sont correctes pour des conseils de base et à des fins de débogage.

Si vous souhaitez en savoir plus sur nos audits de vitesse de site Web ou sur la manière dont nous pouvons concevoir et créer une boutique Shopify ou Shopify Plus pour votre entreprise de commerce électronique, écrivez-nous !