Josselin Dionisi - Développeur indépendant

Le web et la mise en cache, navigateur et serveur

ionicons-v5-k Josselin Dionisi 5 oct. 2022
Logo vague
1185 lectures Niveau :

Le cache navigateur

Vous ne savez peut-être pas comment ça fonctionne mais vous avez déjà tous mis des choses en cache. Ou en tous cas votre navigateur l’a fait pour vous. Si si je vous assure 😛

Lorsque vous visitez un site web une première fois, le temps de chargement est souvent plus long. De nos jours ce n’est plus très visible tant que le site est bien fait mais il y a effectivement un délai de quelques millisecondes pour un premier chargement.

L’explication c’est tout simplement que votre navigateur n’a pas encore pu mettre en cache certains contenus de ce site tels que les images, le CSS, le Javascript, … 

“Oui mais alors c’est quoi cette mise en cache ?” 

C’est le principe de mettre ces fichiers en mémoire directement dans le navigateur afin de pouvoir les resservir plus tard sans les recharger. On ira les actualiser uniquement si on remarque une modification entre le cache et la version actuelle d’une page. 

Le cache serveur

Nous venons de voir le côté navigateur et comme souvent dans le monde du web, il y a un côté serveur à ce principe. 😛

En effet, nous pouvons très bien mettre des choses en cache également sur un serveur. L’intérêt ici c’est de pouvoir traiter des choses de façon asynchrone par exemple, ou mettre de côté des données pour y ré accéder plus tard. 

“Attends mais c’est pas le principe d’une base de données ça ?”

Si, effectivement et l’utilisation d’une base de données peut effectivement être une façon de mettre des éléments en cache côté serveur. Ce n’est pas forcément la plus efficace car les performances peuvent assez vite en pâtir mais sur le papier ça se tient. 

“Comment on peut faire autrement ?”

Une base de données classique utilise un disque dur pour stocker ses informations. Mais pour de la mise en cache, on peut tout à fait utiliser la RAM du serveur. 

On y a accès bien plus vite et c’est exactement ce que fait par exemple Redis l’un des principaux systèmes reconnus par les développeurs. 

Un cas classique

Imaginez que vous ayez une boutique en ligne avec de très nombreux produits. Lorsque vos utilisateurs arrivent sur votre site, ils vont a priori tous tomber sur la même page (la première logiquement). 😄

Si vous deviez charger les résultats depuis la base de données à chaque visite sur votre site, cela serait long et fastidieux pour votre serveur. Il devrait en effet exécuter la même requête sur toute la base. 

En utilisant un système de cache tel que Redis, vous pouvez n’exécuter cette requête qu’une seule fois et conserver le résultat dans la mémoire du serveur. De cette façon, lors de la visite suivante, on ne fera plus appel à la base de données et au système de requêtes, on récupérera seulement le résultat “gardé en cache” pour l’afficher à l’utilisateur. 

Combiner les caches

Bien évidemment il est possible et même recommandé d’additionner les types de cache selon les besoins. Un cache navigateur optimisé couplé à un cache serveur performant offriront une meilleure expérience à vos utilisateurs et leur permettront d’accéder plus vite à ce qu’ils recherchent. 

Vous devriez maintenant comprendre que les principaux sites que vous visitez chaque jour (Google, Youtube, Twitter, …) doivent forcément avoir de très bons caches au vu de la quantité de visites et de données transitant par leurs serveurs. 😀

Si le thème des performances vous intéresse, je prévois un article plus technique sur le sujet 😉