Le cœur de toute bonne analyse de performance

Jan Hornung Dernière mise à jour le 15.01.2021
4 Min.
OptimiserWordPress

Pour qu'une entreprise ou un blog en ligne réussisse, il est essentiel que vous sachiez à quelle vitesse votre page se charge. Et comment vous pouvez optimiser WordPress pour cela. Mais de bons outils d'analyse fournissent des tonnes de données. Les cartes des chutes d'eau, en particulier, ne sont pas faciles à lire. Aujourd'hui, je vais vous montrer trois astuces simples qui vous aideront à tirer le meilleur parti de votre analyse de performance en un seul coup d'œil et à optimiser WordPress aux bons endroits.

Lorsque j'ai commencé à me pencher sur le sujet de l'optimisation de WordPress , j'ai également utilisé pour la première fois webpagetest.org. À l'époque, j'étais littéralement époustouflé par les résultats. Le diagramme de la chute d'eau, en particulier, semble à première vue être une bête de données difficilement saisissable et ordonnée : Les couleurs, les chiffres, la longueur des barres, leur ordre, tout a un sens.

Par conséquent, les tableaux peuvent également vous dire beaucoup de choses précieuses sur votre site. Si vous savez ce qu'il faut chercher.

Aujourd'hui, je vais vous montrer comment vous pouvez utiliser trois astuces simples pour saisir d'un seul coup d'œil des données clés importantes sur le temps de chargement de votre page et ainsi optimiser WordPress aux bons endroits.

Plus précisément, je vais vous montrer :

  • comment reconnaître un serveur web lent
  • comment reconnaître les images non compressées et les fichiers trop volumineux
  • comment savoir si votre serveur supporte HTTP/2

Imitation recommandée

La plupart des données que je vous montre aujourd'hui proviennent de webpagetest.org. Les cartes de cascades de cet outil sont particulièrement complexes, mais elles donnent aussi un bon aperçu de votre site.

Si vous souhaitez suivre les résultats des tests, il vous suffit de cliquer ici et de consulter l'intégralité des données dans Webpagetest.

Si vous souhaitez optimiser votre propre site à l'aide d'une analyse de Webpagetest, vous devez garder à l'esprit que chaque test n'est qu'un instantané. Si vous voulez vraiment des résultats fiables, je vous conseille de faire au moins trois tests. De cette façon, vous réduisez les risques de mesurer les valeurs aberrantes et vous obtenez une meilleure base de données pour les décisions importantes.

OptimiserWordPress  - Diagramme de la cascade
Ce n'est que le premier tiers du diagramme de la cascade pour raidboxes.de. Et déjà ici, il devient clair que le diagramme n'est pas facilement pénétrable.

Comment reconnaître un serveur web lent

La valeur la plus importante pour évaluer le temps de réponse de votre serveur est ce que l'on appelle le Time to First Byte (TTFB). La TTFB est le temps qui s'écoule avant que le premier octet de données ne soit téléchargé du serveur web. Pendant ce temps, rien ne se passe. Du moins, rien que votre visiteur puisse percevoir comme un chargement de page. Il est donc important de maintenir le temps de premier octet aussi bas que possible.

Regardez la première requête de votre diagramme de cascade. Elle doit être aussi courte que possible. De préférence moins de 200 millisecondes.

La première demande de votre page web doit être aussi courte que possible. Le meilleur en dessous de 200 ms.

Cet exemple illustre ce que je veux dire : avant le déménagement chez nous, ce site client avait parfois un TTFB de plus de 3,5 secondes. Après le déménagement, il était bien en dessous de 200 ms. En particulier, la zone bleu pâle de la première demande a massivement diminué.

Avant :

OptimiserWordPress  - Exemple pour le très long Time to First Byte

Avec RAIDBOXES:

OptimiserWordPress  - Time to First Byte with RAIDBOXES

Ainsi, si vous mesurez régulièrement un temps très élevé au premier octet sur vos projets WordPress , une mesure d'optimisation serait de changer d'hébergeur ou de mettre à niveau votre plan d'hébergement en conséquence.

Détecter les images et les ressources trop volumineuses

Chaque ligne de votre diagramme de cascade représente une soi-disant demande. Il s'agit d'une requête du navigateur vers le serveur web. Cette demande comprend le téléchargement de paquets de données, par exemple des images. Dans l'exemple ci-dessous, la partie violette des barres correspond au temps de téléchargement.

OptimiserWordPress  - détecter les images trop grandes

Comme vous pouvez le voir, les images de cette page prennent un temps de chargement très long - presque 12, trois et presque neuf secondes. Une indication claire pour les images non compressées.

Les longues barres violettes indiquent clairement un manque de compression de l'image.

Webpagetest vous indique pour chaque demande exactement de quelle ressource il s'agit. Vous pouvez donc facilement savoir quelle image de votre page WordPress est trop grande et doit être optimisée.

Bien entendu, cela s'applique également à tous les autres types de fichiers que Webpagetest affiche. Par exemple CSS et JavaScript. Ces fichiers peuvent également être compressés, ce qui réduit encore plus le temps de chargement de votre page.

Reconnaître HTTP/2

Si tu veux savoir si tes projets WordPress bénéficient de la norme extra-rapide HTTP/2, tu peux vérifier en jetant un coup d'œil au diagramme en cascade.

Si les requêtes de votre page sont traitées en parallèle, alors HTTP/2 est actif.

Et cette phrase clarifie déjà très bien ce que fait réellement HTTP/2. Si votre site est crypté par SSL, alors HTTP/2 vous permet de traiter plusieurs requêtes de serveur web à la fois. Cela permet de réduire le temps de chargement global.

Voici une page WordPress vide sans SSL :

OptimiserWordPress  - Le diagramme de la cascade d'une page WordPress  sans HTTP/2

Et voici la même page avec le certificat SSL, donc aussi avec HTTP/2 :

OptimiserWordPress  - Diagramme de la cascade d'une page WordPress  vide avec HTTP/2

Vous voyez : dans le premier cas, les demandes individuelles sont chargées l'une après l'autre. Dans le second cas, cependant, ils sont pour la plupart chargés simultanément.

Il est vrai qu'il n'y a pas d'option d'optimisation sur le site WordPress . La meilleure chose à faire est de demander à votre fournisseur d'hébergement si vous utilisez HTTP/2.

Conclusion : n'ayez pas peur du schéma !

Avec un peu de pratique et les bonnes connaissances, vous pouvez obtenir beaucoup d'informations à partir d'une carte de cascade. Vous pouvez voir si votre page bénéficie de certaines technologies, à quelle vitesse votre serveur web répond et si des freins de temps de chargement sont cachés sur votre page. Si vous voulez analyser et optimiser de manière exhaustive vos pages WordPress , il n'y a pas moyen de contourner les diagrammes de cascades.

Vous connaissez d'autres astuces pour identifier rapidement les freins typiques du temps de chargement ? Alors, donnez-le-moi toujours !

RAIDBOXER depuis le début et chef du soutien. Aux Bar- et WordCamps, il aime parler de la vitesse des pages et des performances des sites web. La meilleure façon de le soudoyer est de lui offrir un espresso - ou un bretzel bavarois.

Articles connexes

Commentaires sur cet article

Laisse un commentaire

Ton adresse électronique ne sera pas publiée. Les champs obligatoires sont marqués d'un *.