Jak funguje HTTP cachování s immutable assety a CDN?

Question

IT Interview Practice · Accepted Answer

HTTP cachování umožňuje prohlížečům a CDN znovu použít odpověď místo jejího opětovného stahování, řízené hlavičkou **`Cache-Control`**. Vítězný vzor pro webové aplikace: **hashujte názvy souborů assetů a cacheujte je navěky; HTML nechte necacheovatelné.**

## Dvouúrovňová strategie

```http
# Hashované, verzované assety — obsah se pro danou URL nikdy nemění
Cache-Control: public, max-age=31536000, immutable
# např.  /static/app.9f2c1a.js   (hash se změní, když se změní obsah)

# HTML — musí být vždy čerstvé, aby mohlo ukazovat na nové hashe assetů
Cache-Control: no-cache
```

- **`immutable`** říká prohlížeči, aby nikdy nerevalidoval — žádný podmíněný požadavek, ani při reloadu. Bezpečné, protože hash názvu souboru *je* verze; nový obsah = nová URL.
- **`no-cache`** u HTML je matoucí název: znamená „ulož ho, ale před použitím revaliduj“ (304, pokud se nezměnilo), takže uživatelé vždy dostanou HTML, které odkazuje na aktuální hashe assetů.

## Revalidace a CDN

- **`ETag`** / `Last-Modified` umožňují levné odpovědi `304 Not Modified`, když vyprší `max-age`.
- **CDN** cacheuje na edge uzlech blízko uživatelů. Použijte `s-maxage` pro sdílenou CDN cache a `stale-while-revalidate` k okamžitému servírování zastaralého obsahu při obnovování na pozadí:

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

## Úskalí

- Cachování HTML s dlouhým `max-age` → uživatelé uvíznou na starých verzích bez možnosti to zneplatnit.
- `immutable` na nehashovaných URL → nemůžete poslat opravu.

## Proč je to důležité

Cachování je nejlevnější výkonnostní výhra — mění opakované návštěvy na nulové náklady sítě a odlehčuje origin. Vzor hashovaný-immutable-asset + revalidované-HTML je průmyslový standard; vysvětlení *proč* `no-cache` ≠ „necachovat“ signalizuje skutečnou hloubku.

Dvouúrovňová strategie

Revalidace a CDN

Úskalí

Proč je to důležité

Související otázky