Cache navigateur : définition, Cache-Control et comment le vider

Cache navigateur : la définition simple

Le cache navigateur, c'est un espace de stockage sur votre ordinateur ou votre téléphone. Dès votre première visite, le navigateur y range une copie des fichiers du site. La fois suivante, il pioche dans ces copies au lieu de tout redemander au serveur. Résultat : une page plus rapide, et moins de données mobiles consommées.

Pourquoi un dirigeant devrait-il s'en soucier ? Parce qu'un site rapide garde ses visiteurs, et que Google prend la vitesse en compte à travers les Core Web Vitals. Je le répète souvent à nos clients : bien régler son cache reste l'un des leviers les moins chers pour gagner des dixièmes de seconde.

Ce que le navigateur garde en mémoire

Tout n'atterrit pas dans le cache. Le navigateur privilégie ce qui bouge peu d'une page à l'autre :

• le logo, les icônes et les photos ;
• les feuilles de style CSS (celles qui dessinent la navigation principale, les couleurs et le pied de page) ;
• les fichiers JavaScript qui font vivre menus et formulaires ;
• les polices de caractères.

Ce qu'il ne faut pas confondre avec le cache

Historique, cookies, marque-pages : rien de tout cela n'est du cache. L'historique recense les adresses que vous avez consultées. Vos cookies, eux, mémorisent votre connexion ou votre panier. Quant aux marque-pages, ce sont vos favoris enregistrés, et ils survivent au vidage du cache (sauf si vous cochez d'autres cases au passage).

Cache serveur, cache objet et Cache-Control : les autres couches

Le navigateur n'est qu'un étage de l'édifice. Avant même d'arriver chez le visiteur, une page traverse plusieurs mémoires intermédiaires, chacune avec son rôle.

Le cache serveur

Chez votre hébergement web, le cache serveur conserve une version déjà fabriquée de vos pages. Sans lui, un site WordPress assemble chaque page à la demande : il interroge la base, applique le thème, puis envoie le résultat. Et avec lui ? La page part toute prête. Un CDN pousse la logique plus loin en copiant vos fichiers sur des serveurs proches de chaque visiteur.

Le cache objet

Plus en profondeur, le cache objet mémorise le résultat des requêtes adressées à la base de données : la liste des produits d'une catégorie, par exemple. Redis ou Memcached gardent ces réponses en mémoire vive. Qui en profite le plus ? Les boutiques en ligne et les espaces clients, où beaucoup de pages ne peuvent pas être figées.

L'en-tête Cache-Control

Avec chaque fichier, le serveur envoie une instruction : Cache-Control. Elle indique au navigateur s'il a le droit de garder une copie, et pour combien de temps. Voici les directives que vous croiserez le plus souvent :

• max-age : la durée de conservation, exprimée en secondes ;
• no-cache : le fichier est gardé, mais le navigateur doit vérifier auprès du serveur qu'il est encore à jour ;
• no-store : aucun stockage autorisé, ce qui convient aux pages sensibles ;
• private ou public : réservé au navigateur du visiteur, ou partageable par un CDN ;
• immutable : à cette adresse, le fichier ne changera jamais.

Comment fonctionne le cache d'un navigateur lors d'une visite

Première visite : le navigateur télécharge chaque fichier, lit son en-tête Cache-Control, puis range dans son stockage local les copies autorisées. Ensuite, deux cas se présentent. La copie est encore valide ? Il s'en sert sans rien demander. Elle a expiré ? Il interroge le serveur pour savoir si le fichier a changé.

Supprimer le cache navigateur sur Chrome, Firefox, Safari et Edge

Vider le cache, c'est effacer les copies locales. Le navigateur doit alors tout recharger, et la première page sera un peu plus lente. D'une version à l'autre, les menus varient légèrement. La logique, elle, ne change nulle part : ouvrir les paramètres, choisir une période, cocher la bonne case, valider.

Google Chrome, sur ordinateur et sur Android

Cliquez sur l'icône à trois points en haut à droite, puis sur « Supprimer les données de navigation » (le raccourci Ctrl + Maj + Suppr ouvre la même fenêtre). Choisissez la période : la dernière heure, ou toutes les données. Cochez « Images et fichiers en cache », puis validez avec « Supprimer les données ». Sur Android, le chemin diffère un peu : les trois points, Historique, puis Supprimer les données de navigation.

Firefox

Menu, Paramètres, rubrique Vie privée et sécurité. Dans la partie Cookies et données de sites, cliquez sur « Effacer les données ». Cochez « Contenu web en cache » et décochez le reste si vous voulez rester connecté à vos comptes. Vous préférez le clavier ? Ctrl + Maj + Suppr ouvre la fenêtre d'effacement de l'historique récent ; selon la version, le bouton s'intitule « Effacer » ou « Effacer maintenant ».

Safari, sur Mac et sur iPhone

Sur Mac, je recommande le menu Développement, la méthode la plus propre. Activez-le dans les réglages de Safari (onglet Avancées), puis choisissez « Vider les caches ». Le menu Historique permet aussi d'effacer l'historique, mais il supprime bien plus que le cache. Côté iPhone : Réglages, Safari, puis « Effacer historique et données de site ».

Microsoft Edge

Rendez-vous dans Paramètres, puis Confidentialité, recherche et services. Repérez la partie consacrée aux données de navigation et cliquez sur « Choisir les éléments à effacer ». Il ne reste qu'à cocher « Images et fichiers mis en cache », puis à cliquer sur « Effacer maintenant ».

Recharger une page sans vider tout le cache

Tout supprimer ? Pas forcément utile. Un rechargement forcé demande au navigateur d'ignorer ses copies, mais seulement pour la page affichée. Sur Windows, tapez Ctrl + F5 ou Ctrl + Maj + R. Sur Mac, appuyez simultanément sur Cmd + Maj + R.

Les erreurs courantes, côté site comme côté visiteur

C'est presque toujours après une mise à jour du site que les ennuis commencent. Le visiteur tombe sur un mélange d'ancien et de nouveau, un menu cassé, un formulaire qui ne répond plus. Voici ce que nous corrigeons le plus souvent :

• des durées de cache trop longues sur des fichiers qui gardent toujours le même nom ;
• plusieurs extensions de cache installées sur un même WordPress, qui se contredisent ;
• un panier ou un espace client mis en cache, qui montre les données d'un autre utilisateur ;
• un cache serveur jamais purgé après une modification, qui continue de servir des pages obsolètes ;
• demander à chaque client de vider son cache au lieu de corriger la configuration.

Un réglage propre fait travailler les trois couches ensemble : un cache serveur purgé à chaque publication, un cache objet pour les pages dynamiques, des durées Cache-Control adaptées à chaque type de fichier. Pour le pas-à-pas, lisez notre guide pour accélérer un site WordPress. Et si vous lancez une création de site internet, nous prévoyons ces réglages dès le départ, pour la vitesse comme pour la fiabilité.

Questions fréquentes