25_graph.png Dans le cadre d’un projet de site pour la poste, il est apparu que le site consommait beaucoup plus de bande passante que prévu. Après une rapide enquête, nous nous sommes aperçus que les navigateurs récents allaient chercher toutes les images, feuilles de style et scripts javascript à chaque chargement de page …

Il fallait donc trouver la plus élégante façon de demander aux différents navigateurs de garder en cache ces éléments statiques.

et c’est là que je suis tombé, comme il se doit, sur des éléments de références :

– La norme HTTP1.1 , utilisée par 100% des navigateurs pour communiquer avec les serveurs web. Cette norme explique comment on peut définir des en-têtes standards pour signaler la date de modification d’un fichier statique, ou ses possibilités de mise en cache.
– Le module d’apache mod_expires m’a alors paru la meilleure réponse à ma question

Le module d’apache mod_expires permet de retourner, en plus du contenu habituel, 2 en-têtes HTTP supplémentaire :

Cache-Control: max-age=X et Expires: Y

Ces 2 en-têtes signalent au navigateur que le contenu retourné peut être conservé en cache pendant X secondes, ou jusqu’à la date Y.

Le module mod_expires permet très simplement (lire « dans la configuration d’apache ») de choisir pour chaque type de document le temps d’expiration annoncé.

Tout d’abord, on ajoute la configuration dans/etc/apache2/conf.d/expires :



ExpiresActive On
ExpiresByType image/gif A172800
ExpiresByType image/jpg A172800
ExpiresByType image/png A172800
ExpiresByType text/javascript A172800
ExpiresByType text/css A172800
ExpiresByType application/x-javascript A172800

Ces commandes signifient que le module est activé, et que pour les images, feuilles de style et documents javascript, ces pages seront marquées comme conservable en cache pendant 2 jours (2*86400 secondes) après leur date d’accès (A)

Enfin, on active le module dans apache2 sous Debian :


a2enmod expires && /etc/init.d/apache2 restart

Et voilà !

Pour vérifier le bon fonctionnement de ce module, on peut comparer les en-têtes HTTP retournés avant et après sa configuration :

avant et sans mod_expires :


wget -S http://www.tpcn.fr/images/theme/map_marker_voisins.png

— 04:20:27-- http://www.tpcn.fr/images/theme/map_marker_voisins.png
requête HTTP transmise, en attente de la réponse...
HTTP/1.1 200 OK
Date: Sun, 22 Jul 2007 02:20:27 GMT
Server: Apache
Last-Modified: Fri, 13 Jul 2007 12:30:34 GMT
ETag: "178432-318-470d6e80"
Accept-Ranges: bytes
Content-Length: 792
Keep-Alive: timeout=15, max=100
Connection: Keep-Alive
Content-Type: image/png
Longueur: 792 [image/png]

après et avec mod_expires :


wget -S http://www.tpcn.fr/images/theme/map_marker_voisins.png

— 04:27:57-- http://www.tpcn.fr/images/theme/map_marker_voisins.png
requête HTTP transmise, en attente de la réponse...
HTTP/1.1 200 OK
Date: Sun, 22 Jul 2007 02:27:57 GMT
Server: Apache
Last-Modified: Fri, 13 Jul 2007 12:30:34 GMT
ETag: "178432-318-470d6e80"
Accept-Ranges: bytes
Content-Length: 792
Cache-Control: max-age=172800
Expires: Tue, 24 Jul 2007 02:27:57 GMT
Keep-Alive: timeout=15, max=100
Connection: Keep-Alive
Content-Type: image/png
Longueur: 792 [image/png]

Par ailleurs, on voit une grosse différence dans le nombre de requêtes effectuées sur les images par un parcours de navigation identique avant et après.

Je vous conseille donc vivement d’utiliser ce module dans vos sites à fort trafic.

Catégories : français