Browser-Cache (lokaler Zwischenspeicher)

Browser-Cache: der lokale Zwischenspeicher als Performance-Hebel

Der Browser-Cache ist ein lokaler Zwischenspeicher, in dem der Browser Ressourcen wie Bilder, Stylesheets und Skripte ablegt. Beim erneuten Besuch einer Website lädt er diese Dateien aus dem Cache statt vom Server. Das beschleunigt Wiederbesuche und senkt zugleich Serverlast und Bandbreite.

Als Steuerungshebel für die Ladezeit gehört das Caching zum technischen SEO. Dabei sind zwei Perspektiven zu trennen. Aus Nutzersicht heißt „den Cache leeren" nur, den lokalen Zwischenspeicher zu verwerfen, um veraltete Anzeigen loszuwerden. Für Betreiber zählt dagegen die Konfiguration des Caches als Performance-Hebel — und genau darum geht es im Folgenden.

Den Cache per Cache-Control steuern

Wie und wie lange eine Ressource zwischengespeichert wird, legt der HTTP-Header Cache-Control fest. Er richtet sich an den Browser und an zwischengeschaltete Caches. Die wichtigsten Direktiven:

Quelle: web.dev, HTTP-Caching.

Entscheidend ist nicht, möglichst aggressiv oder möglichst vorsichtig zu cachen, sondern je Ressourcentyp die passende Direktive zu wählen.

Inhalte aktuell halten: Revalidierung und Fingerprinting

Der größte Zielkonflikt beim Caching ist die Balance zwischen Geschwindigkeit und Aktualität. Zwei Mechanismen lösen ihn:

• Revalidierung über ETag und Last-Modified: Ist eine gecachte Ressource abgelaufen, fragt der Browser beim Server nach, ob sie sich geändert hat, per If-None-Match (ETag) oder If-Modified-Since (Last-Modified). Ist sie unverändert, antwortet der Server mit dem Statuscode 304 Not Modified, ohne die Datei erneut zu übertragen. Der inhaltsbasierte ETag ist dabei genauer als der zeitbasierte Last-Modified-Vergleich.
• Fingerprinting (Cache-Busting): Statische Ressourcen erhalten einen Inhalts-Fingerabdruck im Dateinamen, etwa style.x234dff.css, kombiniert mit einem langen max-age. So lässt sich aggressiv cachen und trotzdem sofort aktualisieren: Ändert sich die Datei, entsteht eine neue URL, die den alten Cache-Eintrag umgeht, statt auf dessen Ablauf zu warten.

Für HTML und andere unversionierte Inhalte reicht reines Caching nicht aus; hier sorgt die Kombination aus no-cache und ETag oder Last-Modified für eine effiziente serverseitige Revalidierung. Das Fingerprinting ist im Übrigen auch bei JavaScript-Ressourcen die empfohlene Cache-Strategie und damit ein Baustein guter Ladezeit.

Häufige Fragen zum Browser-Cache

Wie verhindere ich, dass Nutzer veraltete Inhalte sehen?

Über die richtige Kombination aus Caching und Revalidierung: statische Assets mit Fingerprint im Dateinamen lange cachen, HTML dagegen kurz halten und per ETag oder Last-Modified revalidieren. So sehen Nutzer nach einer Änderung sofort den neuen Stand.

Wie leere ich als Nutzer den Cache?

Das geschieht in den Browser-Einstellungen oder per erzwungenem Neuladen. Für Betreiber ist das aber keine Lösung, sondern nur eine Notmaßnahme auf Nutzerseite; die eigentliche Steuerung erfolgt serverseitig über die Cache-Header.

Unterstützung bei der Cache-Konfiguration

Die Faustregel ist schnell gesagt: statische Ressourcen lange cachen und mit einem Fingerabdruck versehen, HTML kurz und revalidiert. Sie sauber umzusetzen, ohne dass Nutzer veraltete Stände sehen, ist die eigentliche Arbeit. mindtwo richtet Cache-Header so ein, dass Tempo und Aktualität zusammenpassen. Angebot anfragen, wenn Ihre Website schnell und trotzdem immer aktuell ausgeliefert werden soll.

Weiterführende Themen zum Browser-Cache

• Das übergeordnete Thema: die Ladezeit
• Die messbaren Kennzahlen der Ladeleistung: die Core Web Vitals
• Warum Caching auch bei JavaScript-Ressourcen zählt: das JavaScript-SEO