Categories: Archives Jobprod.comVie de développeur

Analyser les performances de son site web

Bonjour à tous !

Si vous avez touché un peu au web, une question se pose forcément un jour ou l’autre. Et cette question est : comment se comporte votre site au niveau de sa performance.

Le but de votre site, en plus d’être adapté au format mobile (déjà ça c’est bien), serait d’être le plus rapide possible (personnellement au-dessus de 3 secondes de chargement je trouve ça relou, plus de 6 secondes je ferme l’onglet) et le plus léger possible (pensez à nos amis sur téléphone qui sont limités en data, si il charge que des pages à 10Mo son forfait va pas durer longtemps…).

Bonne nouvelle, un site léger est mécaniquement plus rapide, mais un site rapide n’est pas forcément plus léger.

Il existe une multitude d’outils plus ou moins payants, plus ou moins efficaces pour analyser vos sites web, je vais me concentrer sur 2 outils en particulier

GTMetrix

Avec ce site vous pouvez faire une analyse de la performance de la page et du serveur qui renvoie la page.

L’avantage de cet outil est qu’on est illimité en nombre de pages analysées, et qu’on peut s’attaquer à toutes les pages de son site si on en a envie.

Ici le site est en partie optimisé, les problèmes viennent plutôt des poids des scripts

Pas de problème sur ce site (si on chipote minimize redirect c’est pas un gros truc)

Deviant art qui a visiblement des problèmes avec l’optimisation de ses images…

Pôle emploi qui utilise mal son cache, ses images et qui devait minifier son css

On peut voir une différence assez nette en termes de poids de page, le temps de chargement est plus variable et dépend du serveur où s’effectue le test. Si votre site est hébergé en Europe, le résultat sera plus pertinent avec le serveur de Londres.

Pour améliorer le score des pages, il y a des points d’améliorations à suivre pour PageSpeeed (globalement ce que vous pouvez trouver dans le code html) et YSlow (configuration du serveur), ainsi que notre score pour celui-ci.

Ces points d’amélioration vont de l’utilisation de gzip (de loin celui qui a le plus d’impact), à la minification du code html css et javascript, à l’optimisation des images (qui fera l’objet d’un autre article) et à l’utilisation du cache navigateur.

Dareboost

Il en fait un peu plus que GTMetrix, et avec une interface française s’il vous plaît !

En plus des points identiques à GTMetrix, il analyse votre code javascript pour déceler les problèmes de perf et comprend quelques CMS et frameworks et vous propose des axes d’amélioration pour ceux-ci, ainsi que pour l’accessibilité.

Exemple avec Dareboost : pôle emploi, qui a aussi quelques problèmes

Son seul problème est qu’il est limité à la page d’accueil