What is Caching?

Caching bezieht sich auf die kurzfristige Speicherung von Dateien, wie z.B. Bilder und Webseiten, so dass dieselben Dateien nicht jedes Mal geladen werden müssen, wenn eine Seite aufgerufen wird. Dadurch wird das Erlebnis für den Nutzer in der Regel beschleunigt, da die zu ladende Datenmenge reduziert wird. Das Caching kann an verschiedenen Stellen erfolgen. Ihr Webbrowser kann zum Beispiel Dateien zwischenspeichern, damit er nicht alle Dateien einer Seite, die Sie zuvor besucht haben, erneut herunterladen muss.


Ein Content Delivery Network (CDN) wie Cloudflare wird Dateien auch in größerem Umfang zwischenspeichern, so dass nach dem Zugang zu einer Datei für einen Nutzer dieselbe Datei auch für andere Nutzer auf ihren Servern gespeichert werden kann, ohne dass zusätzliche Anfragen an den Ursprungsserver gestellt werden müssen. Durch diese Art des Caching können CDNs die Zeit reduzieren, die benötigt wird, um dem Nutzer eine gecachte Datei zur Verfügung zu stellen.



Caching, CloudFlare und CSS

Ein potenzielles Problem beim Caching ist, dass es dazu führen kann, dass Änderungen an einer Webseite vorgenommen werden können, ohne dass diese Änderungen für die Besucher der Webseite sofort sichtbar sind. Dies kann passieren, unabhängig davon, ob die Webseite von einem Webbrowser oder von einem Server zwischengespeichert wurde.



Obwohl es normalerweise Anweisungen gibt, die verhindern, dass das Caching auf diese Weise problematisch wird, kann dies ein besonderes Problem bei Cascading Style Sheets (CSS) sein. Wenn Sie CloudFlare für Ihre Webseite verwenden, wird Ihr CSS für eine lange Zeit gecached. Das heißt, wenn Sie Änderungen an Ihrem CSS vornehmen, dauert es eine Weile, bis diese auf der Webseite sichtbar sind. 



CSS Caching Lösung

Sie können dieses Problem lösen, indem Sie den Verweis auf Ihre CSS-Datei im HTML-Code der betreffenden Seite so ändern, dass ein neuer Query-String hinzugefügt wird - zum Beispiel indem Sie "example.css" in "example.css?v=2.2.2" ändern. Dies führt in der Regel dazu, dass sich sowohl CDNs als auch Webbrowser so verhalten, als ob es sich um eine neue Datei handelt, die sie noch nicht heruntergeladen haben - selbst wenn sie es getan haben.



In dem angegebenen Beispiel wird CloudFlare seine übliche Annahme, dass "example.css" dieselbe Datei ist, die es schon immer verwendet hat, auf Eis legen und eine völlig neue Anfrage an den Ursprungsserver stellen, um die neueste Kopie der Datei zu erhalten.



Der Ursprungsserver ignoriert den Query-String "?v=2.2.2", stellt aber dennoch die neueste Version der Datei bereit. Bei der nächsten Aktualisierung von "example.css" kann dies in "example.css?v=2.2.3" geändert werden - oder in eine beliebige Zahl, die der Publisher bevorzugt - so dass CloudFlare wieder die neueste Version erhält.



Weitere Details zu dieser Strategie finden Sie hier.