Sommaire
- Introduction
- Deux couches de cache complémentaires
- Le cache des ressources statiques
- Le cache des pages HTML (statiques & dynamiques)
- Quel type de cache activer ?
Introduction
La mise en cache est une technique incontournable pour améliorer les performances des sites web en réduisant significativement les temps de chargement.
Toutefois, sa mise en œuvre devient plus complexe lorsqu’il s’agit de pages dynamiques, contenant des éléments personnalisés intégrés directement dans le code HTML. Il peut s’agir du nom de l’utilisateur, de recommandations produits, de contenus géolocalisés, de prix personnalisés ou encore d’informations liées à la session ou à l’historique de navigation.
Ces variations rendent chaque page potentiellement unique, ce qui complique leur mise en cache. L’enjeu est alors d’identifier et d’isoler ces zones variables afin de pouvoir optimiser et mettre en cache le reste du contenu, commun à l’ensemble des utilisateurs.
Chez Fasterize, nous avons développé, au fil des années, plusieurs méthodes avancées pour répondre à ces problématiques.
Cet article vous guide à travers les différentes solutions de cache que nous mettons à votre disposition.
Deux couches de cache complémentaires
Fasterize repose sur deux couches de cache complémentaires pour garantir un maximum de performance :
- Un cache CDN, qui, dans sa configuration par défaut, est conçu pour cacher toutes les ressources statiques (images, CSS, JS, polices, etc.) et les servir au plus proche de l’utilisateur final via le réseau avec la possibilité aussi de gérer du cache HTML.
- Un cache moteur Fasterize, intégré au cœur de la plateforme, qui gère le cache HTML (pages statiques ou dynamiques) ainsi que les ressources statiques.
Pourquoi deux couches ?
- Une diffusion rapide via le CDN, en réduisant la latence et la charge serveur.
- Une optimisation poussée des pages HTML dans le moteur Fasterize, avec des stratégies adaptées au contenu (Smart Cache, Cookie Less Cache, Dynamic Cache...).
En résumé : le CDN assure la livraison rapide, tandis que le moteur Fasterize applique l’intelligence d’optimisation et de cache HTML.
Le cache des ressources statiques
La mise en cache des fichiers statiques est une pratique essentielle. Elle s’applique aux ressources comme les fichiers CSS, JavaScript, images, polices, etc.
Le moteur Fasterize respecte l’en-tête HTTP Cache-Control
défini par votre serveur d’origine. Si celui-ci est absent ou incorrect, vous pouvez le remplacer depuis la console en configurant le TTL.
Le moteur permet un paramétrage fin en définissant si la ressource doit être mise en cache côté navigateur, dans un CDN, ou les deux.
Où configurer dans la console ?
Console > Configuration > Cache des ressources
Bon à savoir : Si vous optez pour le cache CDN, les ressources statiques peuvent être directement servies depuis celui-ci, optimisant encore davantage les temps de réponse.
Option : URL Versioning dans l’onglet Assets
Le versionnement des ressources statiques est une technique clé pour garantir une bonne gestion du cache sur le long terme.
Elle permet notamment d’éviter les problèmes liés aux fichiers obsolètes (comme un CSS non mis à jour), mais elle peut aussi réduire le taux de hit cache en multipliant les URL uniques.
Si vous appliquez déjà un versionnement efficace, il n’est pas nécessaire d’activer cette option côté Fasterize.
Principe : un paramètre de version est ajouté à l’URL des fichiers (ex. : style.css?v=12345
).
Lorsqu’une purge du cache est effectuée sur Fasterize, une nouvelle version de l’URL est automatiquement générée, forçant ainsi tous les caches intermédiaires (CDN, navigateur, proxy…) à se mettre à jour.
Avantage : plus besoin de gérer manuellement les expirations longues, ni de forcer les navigateurs à recharger les fichiers : le changement d’URL suffit à invalider l’ancien cache.
Le cache des pages HTML (statiques & dynamiques)
Fasterize permet de mettre en cache des pages HTML, qu'elles soient non personnalisées (statiques) ou partiellement personnalisées (dynamiques).
L’objectif est de maximiser la réutilisation du HTML optimisé tout en respectant les variations liées au contexte utilisateur.
1. Cache des pages HTML statiques
Certaines pages HTML sont identiques pour tous les utilisateurs (FAQ, mentions légales, CGU, etc.). Elles peuvent donc être pleinement mises en cache.
Où configurer dans la console ?
Console > Configuration > Cache des pages
Segmentation du cache HTML
Pour garantir que chaque utilisateur reçoive une version de page adaptée à son contexte de navigation (terminal, bot, etc.), Fasterize applique une classification automatique du cache HTML.
Ce mécanisme définit le nombre de variantes mises en cache pour une même URL. Vous pouvez choisir entre trois modes :
1. Mode Responsive
- 2 versions de cache :
- Version 1 : Desktop, Mobile, Tablette
- Version 2 : Bots (y compris les bots mobiles)
Idéal si votre site est responsive et que le HTML est identique quel que soit le terminal.
2. Mode Adaptatif
- 4 versions de cache :
- Desktop
- Mobile
- Tablette
- Bot
Recommandé si votre site délivre un HTML différent selon le terminal.
3. Mode Adaptatif – Bot First
- 4 versions de cache, comme le mode adaptatif, mais :
- Les bots mobiles sont considérés comme bots, pas comme mobiles
Utile si vous livrez un HTML spécifique aux crawlers.
Où configurer dans la console ?
Console > Configuration > Cache des pages > Onglet Variation de cache
Cache des pages HTML dynamiques
Certaines pages HTML contiennent des éléments personnalisés (compte utilisateur, recommandations, message de bienvenue, prix dynamique, etc.). Bien qu’elles soient partiellement dynamiques, leur contenu est souvent majoritairement commun entre les utilisateurs.
Deux constats issus de notre expérience :
- Les pages dynamiques ne le sont souvent qu’en partie : seule une portion du HTML change.
- Les pages dynamiques ne le sont pas tout le temps : par exemple, une fiche produit reste inchangée tant qu’un utilisateur ne se connecte pas.
C’est sur cette base que nous avons conçu trois stratégies complémentaires pour les pages dynamiques.
a. Le SmartCache
Le SmartCache permet la mise en cache de n’importe quelle page HTML, même partiellement personnalisée.
Principe : la page est découpée entre :
- des zones statiques cachées dans le cache HTML,
- et des zones dynamiques récupérées ensuite par Ajax.
Rendu en 2 temps :
- Le navigateur charge la structure HTML depuis le cache.
- Les blocs dynamiques sont chargés en différé via Ajax.
Rafraîchissement automatique
Quand un utilisateur déclenche une requête Ajax SmartCache :
- Fasterize intercepte la requête.
- Demande les données dynamiques à l’origine.
- Transmet la réponse au navigateur.
- Et rafraîchit le cache du fragment.
Où configurer le SmartCache ?
Console > Configuration > Cache des pages
Ajouter un fragment SmartCache via un sélecteur CSS.
b. Le Cookie Less Cache
Principe : afficher une page en cache tant que l’utilisateur ne possède aucun cookie (visiteur anonyme).
Ce cache permet de répondre rapidement sans solliciter l’origine inutilement.
Avantage : Pas de configuration : il s’active automatiquement.
Où configurer ?
Console > Configuration > Cache des pages > Onglet Variation de cache
À cocher : “Mise en cache anonyme des pages”
c. Le Dynamic Cache
Principe : Fasterize conserve temporairement une version optimisée de la page HTML dynamique pendant 1 minute. Si une autre requête identique arrive dans ce laps de temps, elle est servie sans retraitement.
Bénéfices :
- Réduction du temps d’optimisation (60 ms gagnés en moyenne)
- Moins de charge sur le moteur
Où configurer dans la console ?
Console > Configuration > HTML > Onglet Cache Dynamique
Quel type de cache activer ?
Le choix de la méthode dépend du type de page et de son niveau de personnalisation.
Voici notre ordre de priorité recommandé pour activer intelligemment les différentes stratégies de cache :
- Cache classique
Pour les pages et ressources totalement statiques. - Smart Cache
Pour les pages contenant des zones dynamiques identifiables. - Cookie Less Cache
Pour les pages dynamiques affichées aux visiteurs anonymes (sans cookie). - Dynamic Cache
S’active automatiquement si aucun des trois précédents n’est applicable.
Cette approche permet d’assurer une excellente couverture cache tout en maintenant une personnalisation efficace pour vos utilisateurs.
Cet article a-t-il été utile ?
C'est super !
Merci pour votre commentaire
Désolé ! Nous n'avons pas pu vous être utile
Merci pour votre commentaire
Commentaires envoyés
Nous apprécions vos efforts et nous allons corriger l'article