Cache-Busting ist eine Technik, um veraltete Caches bei CSS-, JavaScript- und Bild-Dateien zu vermeiden: Der Dateiname oder die URL ändert sich mit jedem neuen Inhalt, sodass Browser und CDNs die neue Version garantiert laden — eine alte, gecachte Datei wird durch die neue URL automatisch umgangen.
Die Grundidee
Eine URL ist der Cache-Schlüssel. Ändert sich der Inhalt, aber nicht die URL, bleibt der Cache stale. Beim Cache-Busting enthält die URL einen Fingerprint: einen Inhalts-Hash oder eine Versionsnummer. Beispiel: app.4f2c9f1.js statt app.js. Ändert sich der Inhalt, entsteht ein neuer Hash und damit eine neue URL.
Verfahren im Überblick
- Content-Hash im Dateinamen: Webpack und andere Bundler erzeugen automatisch Hashes (
contenthash), z.B.styles.7890ab.css. - Query-String:
app.js?v=2— funktioniert, verliert aber bei einigen Proxys/CDNs an Bedeutung und ist weniger robust. - Versionsnummer im Pfad:
/assets/v3/logo.png— manuell, oft in älteren Systemen.
Immutables Zusammenspiel
Gefingerprintete Assets sind unveränderlich: Ihr Inhalt ist durch den Hash festgelegt. Deshalb dürfen sie aggressiv gecacht werden — Cache-Control: public, max-age=31536000, immutable (ein Jahr, keine Revalidierung). Die Revalidierung per Conditional Request entfällt für diese Dateien komplett; das spart Latenz und Serverlast.
Vorteile und Grenzen
- Vorteile: kein manuelles Cache-Leeren, deterministische Aktualisierung, optimale Nutzung von Cache-Control.
- Grenzen: HTML-Dateien dürfen NICHT auf diese Weise gefingerprintet werden (sie müssen aktuelle Asset-URLs referenzieren und werden daher kurz oder gar nicht gecacht); Service Worker und Cache API erfordern eigene Update-Strategien.
Verwandte Grundlagen: HTTP-Caching, Cache, Browser, Web Vitals.