Temps de chargement d'une page web

Il existe un moyen très simple d'évaluer le temps de chargement d'une page web. Dans Firefox, si on ouvre l'extension Firebug (Tools / Firebug / Open Firebug, ou encore en cliquant sur l'insecte dans le coin inférieur droit), on notera dans le haut du panneau plusieurs onglets : Console, HTML, CSS, Script, DOM et Net.

Pour le calculer, cliquez sur l'onglet Net (Network Monitoring). Dans certains cas, vous devrez activer la fonction si vous voyez apparaître le message suivant : Net panel is disabled. Cochez la case "Net" et cliquez sur le bouton "Apply settings for [nom du site web]". Cette manipulation sera nécessaire pour chaque site web à monitorer.

Assurez-vous que le filtre "All" (à côté de Inspect et Clear) soit sélectionné pour pouvoir suivre tous les types de ressources et accédez au site en question. Vous verrez défiler chaque requête HTTP GET et POST nécessaire au chargement des différentes ressources incluses dans la page. Pour chacune d'elles, le code HTTP associé sera affiché, par exemple :

• 200 OK - chargé avec succès
  
• 304 Not Modified - récupéré de la cache
• 404 Not Found - la source est introuvable

La colonne suivante indiquera l'origine (sur Amazon ou Yahoo!, on voit que les images proviennent de différents serveurs ou sous-domaines), ensuite le poids du fichier et le temps de chargement. Au bas de chaque colonne, on peut voir le cumulatif pour l'ensemble de la page.

Ainsi, je peux savoir qu'en visitant la page d'accueil de Facebook :

• 249 Kb de matériel sont téléchargés
• Pour un temps de chargement total de 1,45 secondes
• 27 requêtes HTTP ont été nécessaires
  

Au rafraîchissement de la page, je peux voir que le processus récupérera 67 Kb à partir de la cache du fureteur et que le chargement se fera plutôt en 1,2 secondes. Basculez entre les options All, HTML, CSS, JS, XHR, Images et Flash pour filtrer selon le type de ressource.