← Alle Artikel
ArchitekturTech

HTTP Caching: Schnell UND frisch mit stale-while-revalidate

Borzsport Redaktion · Datenanalyse & Technologie09. März 20265 Min. Lesezeit

Der Header

Cache-Control: s-maxage=300, stale-while-revalidate=600

s-maxage=300:               CDN cached 5 Minuten (frisch)
stale-while-revalidate=600: Danach noch 10 Min. stale ausliefern,
                            während im Hintergrund refreshed wird

Warum stale-while-revalidate?

Ohne SWRMit SWR
Cache läuft abCache läuft ab
User wartet auf OriginUser bekommt sofort gecachte Version
Cold Start + DB QueryOrigin refreshed im Hintergrund
Langsam (500ms+)Instant (<50ms)

Der Preis: Daten können bis zu 15 Minuten alt sein (5 frisch + 10 stale). Für ein Kampfsport-Dashboard völlig akzeptabel.

Cache-Busting für Assets

app.min.js?v=a1b2c3      // Hash ändert sich bei jedem Build
style.min.css?v=d4e5f6   // Neuer Build = neuer Hash = frische Datei
max-age=31536000         // Assets: 1 Jahr Cache (immutable)

Tipp: Immer node build.js vor dem Push ausführen! Sonst dient der CDN die alte Version weiter.

Interaktiver Simulator

Passe s-maxage und stale-while-revalidate an und sieh, wie sich der Cache-Lebenszyklus verändert:

INTERAKTIV

Cache-Lebenszyklus Simulator

Passe s-maxage und stale-while-revalidate an und beobachte den Cache-Zustand über die Zeit.

s-maxage300s
stale-while-revalidate600s
Cache-Control: s-maxage=300, stale-while-revalidate=600
s-maxage
stale-while-revalidate
Cache-Miss
0st = 0s960s
Unbearbeitet
Erste Anfrage geht zum Origin-Server.