Tu visites un site. Tu fermes la page. Tu reviens quelques minutes plus tard. Et pourtant, certaines ressources peuvent être réutilisées sans être téléchargées exactement de la même manière qu'au premier passage. Pourquoi ?
Grâce notamment à la mise en cache. Le cache permet de conserver temporairement certaines ressources afin de pouvoir les réutiliser plus rapidement lorsqu'elles sont nécessaires à nouveau.
La mise en cache consiste à conserver temporairement certaines ressources afin de pouvoir les réutiliser plus rapidement. Au lieu de refaire systématiquement certaines opérations ou de télécharger à nouveau certaines ressources, le système peut réutiliser ce qu'il possède déjà en cache.
Le cache peut se trouver à différents endroits. Par exemple : dans le navigateur, sur un serveur ou dans une infrastructure intermédiaire.
Le navigateur peut conserver certaines ressources sur l'appareil du visiteur. Lorsqu'il revient sur le site, certaines ressources peuvent alors être réutilisées plutôt que téléchargées exactement comme lors de la première visite.
Un système de cache peut également fonctionner côté serveur. Dans ce cas, certaines ressources ou certains résultats peuvent être conservés afin d'éviter de refaire certaines opérations à chaque nouvelle demande.
Imaginons qu'un visiteur arrive sur ton site pour la première fois. Son navigateur doit récupérer différentes ressources. Lorsqu'il revient ensuite, certaines de ces ressources peuvent déjà être disponibles dans le cache. Le navigateur peut alors les réutiliser. Cela peut réduire certains téléchargements ou traitements et contribuer à accélérer le chargement du site.
Un visiteur arrive sur ton site. Son navigateur télécharge notamment le logo, une feuille CSS, certaines images et des fichiers JavaScript. Lorsqu'il revient, certaines ressources peuvent être récupérées depuis le cache au lieu d'être téléchargées intégralement à nouveau. Le site peut alors sembler plus rapide.
Mais imaginons maintenant que tu modifies ta feuille CSS. Si une ancienne version est encore conservée en cache, ton navigateur peut continuer à utiliser cette ancienne ressource. Tu peux alors avoir l'impression que ta modification n'a pas fonctionné.
C'est notamment pour cette raison que la gestion des versions et la purge des caches peuvent être importantes lors des mises à jour.
Vérifie si ton CMS propose du cache
Sur WordPress, de nombreuses solutions permettent de gérer le cache. Commence donc par vérifier ce qui est déjà disponible sur ton site avant d'ajouter une nouvelle solution.
Active une configuration adaptée
Le but est de conserver suffisamment longtemps les ressources qui changent peu. Il faut donc trouver une configuration adaptée au fonctionnement réel de ton site.
Pense aux fichiers qui changent
Une feuille CSS modifiée doit pouvoir être identifiée comme une nouvelle version. Cela permet d'éviter qu'un visiteur utilise indéfiniment une ancienne version d'un fichier.
Vérifie le cache serveur
Selon ton hébergement, un système de cache peut également fonctionner côté serveur. Il faut donc regarder ce que ton hébergeur ou ton infrastructure propose.
Purge le cache lorsque nécessaire
Après une modification importante, il peut être nécessaire de vider certains caches. Cela permet de demander au système de repartir avec des ressources actualisées. Attention toutefois : vider un cache ne doit pas devenir un réflexe systématique. Il faut surtout comprendre quel cache pose problème et pourquoi.
Teste depuis un environnement réel
Teste ton site avec une navigation normale et avec des outils de performance. Observe notamment le comportement lors du premier chargement puis lors des chargements suivants.
| Terme | Définition simple |
|---|---|
| Cache | Stockage temporaire permettant de réutiliser plus rapidement une ressource |
| Cache navigateur | Cache conservé sur l'appareil du visiteur |
| Cache serveur | Cache généré ou conservé côté serveur |
| Cache-Control | En-tête HTTP permettant notamment de définir des règles de cache |
| Purge | Action consistant à vider ou renouveler un cache |
Question 1 — Quel est le rôle principal du cache ?
Question 2 — Où peut se trouver un cache ?
Question 3 — Pourquoi peut-on parfois voir une ancienne version d'une page ?
Question 4 — Que peut-on faire après une modification importante si une ancienne version s'affiche encore ?
4/4
Excellent ! Tu comprends maintenant le rôle du cache dans la performance.
Le navigateur peut réutiliser les fichiers. Mais il doit quand même télécharger du code. Et si ce code contient énormément d'espaces, de commentaires ou de caractères inutiles ?
On peut parfois le réduire. C'est la minification.
La Boussole SEO