Comment valider la mise en place de cache pour Site Analyzer

Site Analyzer vs mod_pagespeed

Je vais vous expliquer comment arriver à valider « la mise en place de cache » par l'outil Site Analyzer. Que se soit si vous utilisez mod_pagespeed ou pas sur apache en version 2.X. Ce n'est pas nécessairement THE objectif, mais cela prend une part importante dans la notation. Et tous les autres outils vont aussi vous demander de valider ce paramètre. (pour les impatients, la solution est en toute fin de l'article).

Paradoxe de Site Analyzer

Avant de continuer plus avant sur le comment réussir, je tiens à vous alerter que faire cela peut dégrader légèrement votre note sur Page Speed Insights… Sur la page d'accueil j'ai perdu 20 points en moyenne sur mobile et desktop. Sur les pages de contenus je n'ai qu'une perte de 5/6 points.

Cache-control le header tant recherché

Alors, pour savoir si vous avez du cache sur les ressources web (html, css, js, etc.) avec apache rien de plus simple. Pour se faire il suffit de regarder les entêtes renvoyées par le serveur web du site Internet. Pour voir ces entêtes sous firefox vous pouvez utiliser l'extension firebug via l'onglet "Réseau" et en cliquant sur la ressource désirée : 

firebug copy

Cache-control, est l'entête qu'envoie votre serveur pour dire au navigateur web de conserver le fichier en cache. Il y a donc plusieurs valeurs que l'on va regarder tout de suite.

  • no-cache : indique au navigateur de demander systématiquement le fichier au serveur
  • public : la ressource peut être mise en cache par tous
  • private : idem que public, sauf que la ressource ne peut pas être mise en cache par les proxys
  • must-revalidate : la ressource que vous demandez doit être re-téléchargée par le navigateur
  • max-age : c'est le temps en seconde que votre navigateur devra attendre avant d'aller rechercher le contenu.

Donc si votre entête ressemble à l'un des exemples qui suit cela veut dire que vous n'avez pas de cache sur cette ressource :

  • max-age=0, no-cache
  • max-age=0
  • no-cache

Ce que l'on recherche c'est quelque chose comme ceci : max-age=3600, public ou max-age=3600, private

Pour tout savoir sur Cache-Control vous pouvez aussi lire cette page sur Wikipedia : Cache-Control

Comment configurer Cache-Control sur apache ?

Pour ce faire vous avez déjà besoin que sur votre serveur apache soit installé les modules suivants : 

  • headers
  • cache

Je ne vais pas revenir sur comment les installer sur apaches, ça ne me parait pas nécessaire, car très souvent ils le sont d'offices. Pour qu'apache utilise la mise en cache de votre navigateur il suffit d'ajouter les lignes suivantes dans le fichier .htaccess de votre fichier.

<IfModule mod_headers.c>

#Mise en cache de tous
Header set Cache-Control "max-age=600, private, must-revalidate"

#Mise en cache prolongé pour les ressources images, CSS et JS
<FilesMatch ".(ico|jpe?g|png|gif|swf|css|gz|js|js?ver=*|css?ver=*)$">
Header set Cache-Control "max-age=2592000, public"
</FilesMatch>

#Mise en cache des ressources HTML (les fameuses !)
<FilesMatch ".(html|htm)$">
Header set Cache-Control "max-age=7200, public"
</FilesMatch>

</IfModule>

Une fois ajouter ces lignes dans votre fichier .htaccess, actualiser la page de votre site et regarder ce que firebug vous dit sur les entêtes. En toute logique tout devrait être bon !

Mod_pagespeed cache-control pour les fichiers HTML, PHP

Alors, dans mes premiers test de mod_pagespeed j'étais tout content. Mais quand on m'a posé le challenge de valider le site sur Site Analyser, j'ai un peu déchanté… J'ai d'ailleurs passé 3 ou 4 heures à trouver une solution, j'ai écumé le net mais rien trouvé…

Le soucis réel est que toutes mes ressources étaient bien en cache, css, js etc. Mais la page HTML en elle même non… Alors que j'avais tout ce qu'il fait, du moins je le pensais, dans mon .htaccess pour avoir cette valeur.

D'abord, il manquait les petites lignes magiques que je vous ai montré avant. Mais surtout j'avais un réglage d'activer sur mod_pagespeed qui rendait caduc toutes les configurations possibles que je pouvais faire dans mon .htaccess.

Donc pour valider la mise en place de cache sous Site Analyzer avec mod_pagespeed il ne faut pas activer l'option suivante :

AddOutputFilterByType MOD_PAGESPEED_OUTPUT_FILTER text/html

Vous devez donc commenter la ligne dans le fichier de configuration de mod_pagespeed. Attention on ne peut le désactiver que depuis le fichier de configuration. Donc si jamais votre hébergeur l'a activé vous êtes bleu... En espérant que cet article vous aide !