Hogyan működik a HTTP-cache-elés immutable assetekkel és egy CDN-nel?

Question

IT Interview Practice · Accepted Answer

A HTTP-cache-elés lehetővé teszi, hogy a böngészők és a CDN-ek újrahasználjanak egy választ ahelyett, hogy újra letöltenék, amit a **`Cache-Control`** fejléc vezérel. A webalkalmazások nyerő mintája: **hasheld az asset fájlneveidet, és cache-eld őket örökre; a HTML-t pedig tartsd nem cache-elhetőnek.**

## A kétszintű stratégia

```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
```

- Az **`immutable`** azt mondja a böngészőnek, hogy soha ne revalidáljon — egyáltalán nincs feltételes kérés, még újratöltéskor sem. Biztonságos, mert a fájlnév hash *maga* a verzió; új tartalom = új URL.
- A **`no-cache`** a HTML-en félrevezetően van elnevezve: azt jelenti, hogy „tárold, de használat előtt revalidálj” (304, ha változatlan), így a felhasználók mindig olyan HTML-t kapnak, amely az aktuális asset hasheket hivatkozza.

## Revalidáció és a CDN

- Az **`ETag`** / `Last-Modified` olcsó `304 Not Modified` válaszokat tesz lehetővé, amikor a `max-age` lejár.
- Egy **CDN** a felhasználókhoz közeli edge node-okon cache-el. Használd az `s-maxage`-t a megosztott CDN-cache-hez, és a `stale-while-revalidate`-et, hogy azonnal kiszolgáld az elavult tartalmat, miközben a háttérben frissíted:

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

## Buktatók

- A HTML cache-elése hosszú `max-age`-dzsel → a felhasználók régi verziókon ragadnak, anélkül, hogy ki lehetne üríteni.
- Az `immutable` nem hashelt URL-eken → nem tudsz javítást kiszállítani.

## Miért fontos

A cache-elés a legolcsóbb teljesítménynyereség — az ismételt látogatásokat nulla hálózati költséggé alakítja, és tehermentesíti az origint. A hashelt-immutable-asset + revalidált-HTML minta az iparági szabvány; ha elmagyarázod, *miért* nem egyenlő a `no-cache` a „ne cache-elj”-jel, az valódi mélységet jelez.

A kétszintű stratégia

Revalidáció és a CDN

Buktatók

Miért fontos

Kapcsolódó kérdések