J'essaie de comprendre comment gérer correctement le cache du navigateur Web pour les applications à page unique.
J'ai une conception assez typique: plusieurs fichiers HTML, JS et CSS implémentant le SPA, et un tas de données JSON consommées par le SPA. Des problèmes surviennent lorsque je souhaite effectuer une mise à jour: je mets à jour la partie statique du site et le code qui génère le JSON en même temps, mais les navigateurs clients ont souvent la partie statique mise en cache, donc l'ancien code essaie de traiter les nouvelles données et peut (en fonction des modifications apportées) rencontrer des problèmes. (En particulier, IE semble plus agressif que Chrome ou Firefox à propos de l'utilisation de JS en cache sans revalidation.)
Quelle est la meilleure façon de gérer cela?
- Assurez-vous que mes modifications JSON sont rétrocompatibles et supposez que les caches du navigateur expireront dans un délai raisonnable.
- Incorporez une sorte de numéro de version dans le JS statique et le JSON, puis exécutez-les
window.location.reload(true);
s'ils ne correspondent pas. - Déterminez la combinaison appropriée d'en-têtes (
must-revalidate
ouno-cache
autre); les sources varient selon la façon de procéder) pour garantir que les navigateurs revalident toujours toutes les ressources à chaque chargement, même si cela signifie quelques allers-retours supplémentaires pour charger le site. - Micro-gérer mon contrôle de cache et expire les en-têtes afin que le contenu statique expire lorsque je veux pousser une mise à jour.
- Autre chose?