msgbartop
Faut pas y craindre
msgbarbottom

27 fév 08 Accelerer significativement le chargement de vos pages avec YSlow!

yslow logo Sous ce titre racoleur au possible se cache un petit bijou d’extension pour Firefox: YSlow, qui s’intégre au non moins merveilleux add-on Firebug.
Aparté: si tu es webdeveloper mais que tu ne connais pas Firebug, fais-toi du bien et installe-le vite!

Bon ok, mais YSlow c’est quoi?

YSlow analyse les pages web et détecte tout ce qui ralentit le chargement de celles-ci. Il fait un rapport de performance, la liste des composants chargés et inclut des outils comme JSLint.
Et surtout vous pouvez ensuite facilement obtenir de l’aide sur les points qui bloquent grâce aux règles d’optimisation qui sont détaillées. Qu’est-ce que j’ai pu apprendre avec ce truc…

Let’s go

Revenons à nos moutons, à savoir YSlow. Il faut donc prélablement installer Firebug dans votre Firefox, puis YSlow lui-même.

Vous allez alors voir apparaitre un discret bouton dans votre barre grise en bas:
yslow barre des taches

Magiiique!!

Ensuite il suffit de cliquer dessus pour lancer la bête (après vous être rendus sur la page que vous voulez analyser, cela va sans dire!), puis de cliquer sur « Performance » pour obtenir le premier rapport:
yslow rapport

Ce rapport sanctionne chaque point d’optimisation d’une note allant de A à F. A c’est OK, F c’est bouh! Bon il est un peu sévère sur la note globale (le rapport ci-dessus est issu de ce blog)… mais peu importe. En cliquant sur chaque point vous etes renvoyés vers la page des règles qui contient des conseils pour améliorer chaque domaine.

Ensuite en allant dans l’onglet « Stats » on obtient un rapport plus chiffré de la page avec/sans cache. Généralement là ça commence à faire mal aux yeux quand on voit la taille cumulée des javascripts…

YSlow stats

Enfin, last but not least, dans l’onglet « Components » on trouve une liste détaillé des composants chargés avec plein d’infos utiles comme le temps de réponse, son état de compression (ou non), la durée du cache..

Bref, c’est à installer absolument car:

  • Cela permet de détecter des faiblesses éventuelles dans l’optimisation des pages, sans omettre aucun point
  • et de travailler ces faiblesses grâce aux conseils!
  • et surtout, d’en apprendre encore plus sur le pourquoi du comment d’une page web…

Tout le monde aura compris, je suis fan. D’ailleurs maintenant vous passez tous à la moulinette :)
Je n’ai pas trouvé d’autre outil plus exhaustif pour l’optimisation des pages mais si vous avez, je suis interessé!!

Be Sociable, Share!
Articles en rapport (ou pas!) :

Reader's Comments

  1. |

    Bonjour ,il est super Yslow , merci .
    J’ai fait récemment un petit résumé , je vous invite à le voir : optimisation des sites web et accélération d’affichage des pages .
    Bonne journée

Leave a Comment