3.3Performance & cache
L'essentiel en 30 secondes
- Le cache sert une version pré-générée des pages au lieu de les reconstruire à chaque visite : le levier de vitesse n°1.
- On combine cache + images optimisées + lazy loading ; la minification CSS/JS et un CDN complètent selon les besoins.
- On ne devine pas : on mesure avec PageSpeed Insights ou GTmetrix avant et après chaque optimisation.
Mini-cas filé — huit secondes, c'est trop
Le site de l'atelier met huit secondes à s'afficher : les photos sont lourdes et chaque page est reconstruite à chaque visite. Samir mesure le point de départ, installe un cache adapté à l'hébergement, active la minification et vérifie que rien ne casse. Il mesure à nouveau et présente le gain à Hassan avec des chiffres.
Suite du cas 3.2 — le site est visible, il doit aussi être rapide.
1. Le cache, levier n°1
Sans cache, WordPress reconstruit chaque page à chaque visite : PHP interroge la base de données, assemble le HTML, puis l'envoie. Le cache conserve une version déjà générée et la sert quasi instantanément. C'est souvent le gain le plus spectaculaire pour un site vitrine ou un blog.
Le choix de l'extension dépend de l'hébergement : LiteSpeed Cache si le serveur est LiteSpeed, WP Super Cache ou W3 Total Cache en gratuit, WP Rocket en payant pour la simplicité. Samir n'active qu'une seule extension de cache et vide le cache après chaque modification importante.
2. Compléter et mesurer
Le cache ne suffit pas si les images pèsent plusieurs mégaoctets. On combine avec l'optimisation des images (section 1.3) et le lazy loading. La minification supprime espaces et commentaires du CSS/JS ; un CDN rapproche les fichiers des visiteurs, surtout pour un public international. Chaque option doit être testée : une minification agressive peut casser un affichage.
Samir mesure avec PageSpeed Insights ou GTmetrix avant et après. Il note les scores, le temps de chargement et les recommandations, puis corrige une chose à la fois. En performance, la preuve est chiffrée : c'est aussi ce qui rassure le client.
🔎 Exemple concret — Accélérer l'atelier (cas Samir)
Avant : 8,2 s, score PageSpeed 38.
1. Images redimensionnées et compressées.
2. LiteSpeed Cache activé (cache de pages + lazy loading).
3. Minification CSS/JS testée sur une page.
Après : 2,1 s, score 82.
→ Vérifier panier et formulaires après activation.Résultat : un gain mesuré et présentable au client.
Leçon : une optimisation à la fois, puis mesure.
Vocabulaire de la section
- Cache
- Version pré-générée des pages, servie au lieu d'être reconstruite à chaque visite.
Exemple simple : la page Collections se charge quasi instantanément.
Ce que ce n'est pas : laisser WordPress reconstruire chaque page à chaque visite.
Réflexe : cache = vitesse n°1.
- Extension de cache
- Module qui génère et sert le cache : LiteSpeed, WP Super Cache, WP Rocket.
Exemple simple : une seule extension active à la fois.
Ce que ce n'est pas : cumuler trois extensions de cache.
Réflexe : une extension, bien réglée.
- Minification
- Suppression des espaces et commentaires du CSS/JS pour réduire le poids.
Exemple simple : activer la minification puis tester le rendu.
Ce que ce n'est pas : minifier sans vérifier que la page fonctionne.
Réflexe : test après minification.
- CDN
- Réseau de serveurs qui rapproche les fichiers du visiteur.
Exemple simple : Cloudflare pour un public hors du Maroc.
Ce que ce n'est pas : payer un CDN sans audience internationale.
Réflexe : CDN = utile selon l'audience.
- Mesure (PageSpeed)
- Outils qui notent la vitesse et listent les problèmes à corriger.
Exemple simple : PageSpeed Insights avant/après.
Ce que ce n'est pas : juger la vitesse au ressenti.
Réflexe : chiffres avant/après.
En pratique — Accélérer le site et le prouver
- Mesurez une page dans PageSpeed Insights et notez le score.
- Installez une seule extension de cache adaptée à l'hébergement et activez le cache de pages.
- Activez les options utiles (lazy loading, minification) et vérifiez que le site fonctionne.
- Re-mesurez et comparez les scores et le temps de chargement.
Script prêt à dire — présenter le gain (20 s)
« Avant, votre site mettait plus de huit secondes à s'afficher. Après optimisation, on descend autour de deux secondes : les visiteurs restent, et Google valorise les sites rapides. Je vous montre les mesures avant et après. »
Toujours appuyer sur des chiffres mesurés, pas sur une impression.
Modèle copier-coller — fiche performance
PAGE MESURÉE : _______________
SCORE AVANT : _______________ / TEMPS : _______________
CACHE ACTIVÉ : oui / non (extension : _______________)
IMAGES OPTIMISÉES : oui / non / LAZY LOADING : oui / non
SCORE APRÈS : _______________ / TEMPS : _______________
ANOMALIES VÉRIFIÉES : panier / formulaires / menuHébergement LiteSpeed
LiteSpeed Cache offre cache, minification et lazy loading intégrés.
Mutualisé classique
WP Super Cache suffit pour une vitrine ; mesurer après réglage.
Boutique
Exclure panier et compte du cache, tester le tunnel d'achat.
Audience internationale
Ajouter un CDN et vérifier les performances depuis plusieurs régions.
✓ Bonnes pratiques
- Mesurer avant et après chaque changement.
- Une seule extension de cache.
- Tester panier et formulaires après optimisation.
✗ Pièges fréquents
- Cumuler plusieurs extensions de cache.
- Minifier sans vérifier le rendu.
- Optimiser au ressenti sans mesure.
Points clés à retenir
- Le cache est le levier de vitesse n°1.
- Cache + images + lazy loading forment le trio performance.
- Une seule extension de cache, bien réglée.
- On mesure avec PageSpeed avant et après.
Défi 48h — appliquez demain
Mesurez une page, activez le cache et optimisez les images, puis mesurez à nouveau. Notez les deux scores et le temps gagné. 20 minutes.
- Je mesure la vitesse avant d'optimiser.
- J'active un cache adapté sans doublon.
- Je vérifie que les optimisations ne cassent rien.
Questions fréquentes
Le cache est-il utile sur un petit site ?
Oui : même une vitrine peu visitée gagne un temps de réponse net, et le cache réduit la charge du serveur. C'est l'une des optimisations les plus rentables.
Pourquoi vider le cache après une modification ?
Parce que le cache sert une ancienne version de la page. Après une modification de contenu, de design ou d'extension, on vide le cache pour voir et servir la nouvelle version.
Le CDN est-il indispensable ?
Non. Il devient intéressant quand l'audience est éloignée du serveur ou que le trafic est important. Pour un public local, un bon hébergement et un cache bien réglé suffisent souvent.
Le site de l'atelier met huit secondes à s'afficher. Quel est le levier le plus rentable ?