Lorsque vous visitez un site web pour la première fois, votre navigateur télécharge de nombreux fichiers pour afficher la page. Cela inclut le code HTML, les images, les feuilles de style et les fichiers JavaScript. Cela peut représenter une quantité importante de données et entraîner une certaine lenteur, surtout sur un appareil mobile, uniquement à cause de la mise en cache du navigateur.
Cependant, la plupart de ces fichiers sont utilisés sur l'ensemble de votre site web. Le même logo, la même feuille de style et les mêmes fichiers JavaScript sont utilisés sur chaque page. Ne serait-il pas formidable de pouvoir télécharger tous ces fichiers une seule fois ? C'est exactement ce que cela implique. mise en cache du navigateur Il stocke une copie de ces fichiers dans le navigateur du visiteur, et la prochaine fois que ce fichier est requis, le navigateur le récupère depuis son propre cache plutôt que depuis le serveur. Le résultat est une expérience utilisateur beaucoup plus rapide et efficace.
Comment fonctionne la mise en cache du navigateur
La mise en cache du navigateur est une idée simple. Vous définissez un Date d'expiration Pour un fichier, ce paramètre indique au navigateur combien de temps il peut enregistrer ce fichier avant de devoir en télécharger une nouvelle copie. Par exemple, vous pouvez demander à un navigateur de mettre en cache votre feuille de style pendant un mois. Après la première visite, la feuille de style est enregistrée localement et le navigateur ne téléchargera plus de nouvelle copie depuis le serveur avant 30 jours.
C'est un excellent moyen d'améliorer la vitesse de chargement de vos pages, mais il y a un problème : si vous modifiez un fichier en cache, un visiteur ayant déjà visité votre site verra toujours l'ancienne version jusqu'à la date d'expiration. Nous verrons comment résoudre ce problème plus tard.
Vérifiez si la mise en cache du navigateur est activée sur votre site
Vous vous demandez probablement maintenant si la mise en cache est activée sur votre site web. Vous pouvez utiliser l'outil Outil d'audit de site ClickRank pour analyser l'intégralité de votre site web en une seule fois. Il peut analyser chaque fichier de votre site et afficher la date d'expiration de chacun. C'est une étape cruciale pour comprendre les performances de votre site web et la vitesse de chargement de vos pages.
Comment configurer la mise en cache du navigateur
La configuration de la mise en cache du navigateur est une tâche simple, mais importante. Si vous ne spécifiez pas explicitement de délai d'expiration, le navigateur du visiteur tentera systématiquement de récupérer une nouvelle copie du site depuis le serveur, ce qui peut considérablement ralentir son expérience.
Apache : Expire les en-têtes
Si vous utilisez un serveur Apache, vous pouvez configurer la mise en cache en modifiant votre .htaccess Fichier. Vous pouvez définir la date d'expiration de chaque type de fichier individuellement. Par exemple, vous pouvez définir la date d'expiration des polices à un an, des images à trois mois, et des feuilles de style et JavaScript à un mois. C'est une méthode simple et efficace pour activer la mise en cache du navigateur.
Contrôle du cache Apache
Une autre façon de définir les instructions de mise en cache est la Cache-Control En-tête. Son fonctionnement est très similaire et offre quelques options supplémentaires. Pour la plupart des sites web, l'utilisation d'en-têtes Expires suffit.
Mise en cache du navigateur dans WordPress
Si vous utilisez un CMS comme WordPress, vous pouvez utiliser une extension pour activer la mise en cache du navigateur. De nombreuses extensions performantes permettent d'activer la mise en cache en quelques clics. C'est une excellente option si vous n'avez pas accès au serveur. .htaccess fichier ou si vous préférez utiliser un plugin pour le gérer à votre place. Une plateforme complète Clickrank peut vous aider. Par exemple, la plateforme peut analyser votre site web à la recherche de problèmes de mise en cache et vous fournir une liste de tâches prioritaires pour les résoudre.
Invalidation du cache
Que faire si vous devez modifier un fichier en cache ? Par exemple, vous avez modifié votre logo, mais tous les visiteurs récents de votre site voient toujours l'ancien. Demander à tout le monde de vider son cache n'est pas envisageable.
Une solution consiste à modifier le nom du fichier. Par exemple, vous pouvez style.css à style-nouveau.cssLe navigateur considérera qu'il s'agit d'un nouveau fichier et téléchargera la dernière version depuis le serveur. C'est un moyen simple et efficace de forcer un navigateur à télécharger un nouveau fichier, même si le délai d'expiration n'est pas encore expiré.
