Wie funktioniert HTTP-Caching mit unveränderlichen Assets und einem CDN?

Question

IT Interview Practice · Accepted Answer

HTTP-Caching erlaubt es Browsern und CDNs, eine Antwort wiederzuverwenden, statt sie erneut abzurufen — gesteuert über den **`Cache-Control`**-Header. Das erfolgreiche Muster für Web-Apps: **hashe die Dateinamen deiner Assets und cache sie für immer; halte HTML nicht cachebar.**

## Die zweistufige Strategie

```http
# Hashed, versioned assets — content never changes for a given URL
Cache-Control: public, max-age=31536000, immutable
# e.g.  /static/app.9f2c1a.js   (the hash changes when content changes)

# HTML — must always be fresh so it can point at new asset hashes
Cache-Control: no-cache
```

- **`immutable`** sagt dem Browser, niemals zu revalidieren — überhaupt kein Conditional Request, selbst beim Neuladen. Sicher, weil der Dateiname-Hash *die* Version ist; neuer Inhalt = neue URL.
- **`no-cache`** bei HTML ist irreführend benannt: Es bedeutet „speichere es, aber revalidiere vor der Nutzung“ (ein 304, falls unverändert), sodass Nutzer stets HTML erhalten, das auf die aktuellen Asset-Hashes verweist.

## Revalidierung und das CDN

- **`ETag`** / `Last-Modified` ermöglichen günstige `304 Not Modified`-Antworten, wenn `max-age` abläuft.
- Ein **CDN** cacht an Edge-Knoten in der Nähe der Nutzer. Verwende `s-maxage` für den gemeinsamen CDN-Cache und `stale-while-revalidate`, um veralteten Inhalt sofort auszuliefern und ihn im Hintergrund zu aktualisieren:

```http
Cache-Control: public, s-maxage=600, stale-while-revalidate=86400
```

## Fallstricke

- HTML mit langem `max-age` zu cachen → Nutzer bleiben auf alten Versionen hängen, ohne Möglichkeit, den Cache zu invalidieren.
- `immutable` bei nicht gehashten URLs → du kannst keinen Fix ausliefern.

## Warum es wichtig ist

Caching ist der günstigste Performance-Gewinn — es macht wiederholte Besuche zu null Netzwerkkosten und entlastet den Origin. Das Muster aus gehashten unveränderlichen Assets + revalidiertem HTML ist der Industriestandard; zu erklären, *warum* `no-cache` ≠ „nicht cachen“ ist, signalisiert echte Tiefe.

Die zweistufige Strategie

Revalidierung und das CDN

Fallstricke

Warum es wichtig ist

Ähnliche Fragen