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

Pingdom

Je ne vais pas vous faire d’analyse poussée dessus, je ne m’en suis servi que quand GTMetrix était en rade 🙂

Thibault Poisson

Recent Posts

Communauté Tech et féminine : Interview avec Helvira de Motiv’her

Elles sont passées où les femmes dans la tech ? Entre le manque de représentation…

4 jours ago

Consommer des APIs HTTP en PHP comme un pro avec Nicolas Grekas.

Dans cette vidéo, on interview Nicolas Grekas, contributeur clé de Symfony, pour discuter de sa…

4 jours ago

Trouver son job grâce à WeLoveDevs.

 Comment trouver son job dans la tech ? Marie a la réponse ! Grâce à…

6 jours ago

Adobe, L’empire créatif.

Adobe, l'empire créatif, et pas des moindres ! Belle ascension de la part de ces…

1 semaine ago

La MAO musique ou musique assistée par ordinateur

Est-ce plus simple de créer des morceaux avec les outils de Musique Assistée par Ordinateur…

1 semaine ago