Was ist Caching?
Caching bezieht sich auf die kurzfristige Speicherung von Dateien, wie Bildern und Webseiten, sodass dieselben Dateien nicht jedes Mal neu geladen werden müssen, wenn eine Seite angesehen wird. Dies beschleunigt in der Regel die Benutzererfahrung, da die zu ladende Datenmenge reduziert wird. Caching kann an vielen Stellen erfolgen. Zum Beispiel kann Ihr Webbrowser Dateien zwischenspeichern, sodass er nicht jede Datei auf einer Seite erneut herunterladen muss, wenn Sie diese Seite bereits besucht haben.
Ein Content Delivery Network (CDN) wie Cloudflare wird Dateien ebenfalls in größerem Umfang zwischenspeichern, sodass nachdem eine Datei im Namen eines Benutzers abgerufen wurde, dieselbe Datei auf ihren Servern für andere Benutzer gespeichert werden kann, ohne dass zusätzliche Anfragen an den Ursprungsserver gestellt werden müssen. Durch dieses Caching können CDNs die Zeit verkürzen, die benötigt wird, um eine zwischengespeicherte Datei dem Benutzer bereitzustellen.
Caching, Cloudflare und CSS
Ein potenzielles Problem beim Caching ist, dass es zu einer Situation führen kann, in der Änderungen an einer Seite für die Besucher der Seite möglicherweise nicht sofort sichtbar sind. Dies kann passieren, unabhängig davon ob die Seite von einem Webbrowser oder einem Server zwischengespeichert wurde.
Obwohl normalerweise Schutzmaßnahmen vorhanden sind, um zu verhindern, dass Caching problematisch wird, kann dies ein besonderes Problem bei Cascading Style Sheets (CSS) sein. Wenn Sie Cloudflare mit Ihrer Seite verwenden, werden sie Ihr CSS lange zwischenspeichern. Das bedeutet, dass es nach Änderungen am CSS eine Weile dauern wird, bis diese auf der Live-Seite sichtbar sind.
CSS Caching-Lösung
Dies kann gelöst werden, indem der Verweis auf Ihre CSS-Datei im HTML der betreffenden Seite geändert wird, sodass eine neue Abfragezeichenfolge 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 sowohl CDNs als auch Webbrowser so reagieren, als ob es sich um eine neue Datei handelt, die sie noch nicht heruntergeladen haben - auch wenn sie es bereits getan haben.
Im gegebenen Beispiel wird Cloudflare seine übliche Anfrage an "example.css" (die gleiche Datei, die es immer verwendet hat) zurückhalten und stattdessen eine vollständig neue Anfrage an den Ursprungsserver stellen, um die neueste Kopie der Datei zu erhalten.
Der Ursprungsserver wird die Abfragezeichenfolge "?v=2.2.2" ignorieren, aber dennoch die neueste Version der Datei bereitstellen. Beim nächsten Update von "example.css" kann dies in "example.css?v=2.2.3" geändert werden - oder in eine beliebige Nummer Ihrer Wahl - damit Cloudflare erneut die neueste Version erhält.