Nous allons commencer par la façon la plus simple d’augmenter la vitesse d’affichage d’un site, en optimisant la gestion du cache du navigateur.

Les sites internet sont de plus en plus riches en contenu (10 photos par pages, 30 icones, etc). Les navigateurs utilisent des « caches », qui enregistrent temporairement les visuels, les feuilles de styles et les fichiers javascript, sur le disque dur. Ils se basent sur l’en-tête de ses fichiers, qui devrait contenir quelque chose comme :

Expires: Thu, 25 Apr 2011 16:00:00 GMT

Ce qui signifie que le fichier ne sera pas modifié avant le 25 avril 2011. Donc, entre aujourd’hui et cette date il est inutile de le re-télécharger, si on l’a déjà dans le cache.

Voici les chiffres d’un test  de chargement d’une page :

Page sans le cache :
- 28Ko le fichier html
- 1.9 Ko 1 fichier css
- 59 Ko 4  fichier js
- 78 Ko 24 images

Taille total : 168 Ko
Nombre de requête HTTP : 30 (nombre d’échange entre le client et le site)
Temps de  chargement : 2.4s

Page avec le cache :
- 28Ko le fichier html

Taille total : 28 Ko
Nombre de requête HTTP : 1
Temps de  chargement : 0.9s

Pour activer l’écriture des en-têtes « expires » il suffit de coller dans un fichier .htaccess ce code :

<FilesMatch "\.(ico|pdf|flv|jpe?g|png|gif|js|css|swf)$">
    ExpiresActive On
    ExpiresDefault "access plus 1 year"
</FilesMatch>