Comment fonctionne le cache HTTP avec des assets immuables et un CDN ?

Question

IT Interview Practice · Accepted Answer

Le cache HTTP permet aux navigateurs et aux CDN de réutiliser une réponse au lieu de la récupérer à nouveau, contrôlé par l'en-tête **`Cache-Control`**. Le pattern gagnant pour les applications web : **hachez les noms de fichiers de vos assets et mettez-les en cache pour toujours ; gardez le HTML non cacheable.**

## La stratégie à deux niveaux

```http
# Assets hachés et versionnés — le contenu ne change jamais pour une URL donnée
Cache-Control: public, max-age=31536000, immutable
# ex.  /static/app.9f2c1a.js   (le hash change quand le contenu change)

# HTML — doit toujours être frais pour pointer vers les nouveaux hashes d'assets
Cache-Control: no-cache
```

- **`immutable`** indique au navigateur de ne jamais revalider — aucune requête conditionnelle du tout, même au rechargement. C'est sûr car le hash du nom de fichier *est* la version ; nouveau contenu = nouvelle URL.
- **`no-cache`** sur le HTML porte mal son nom : il signifie « stocke-le, mais revalide avant de l'utiliser » (un 304 si inchangé), afin que les utilisateurs reçoivent toujours un HTML qui référence les hashes d'assets actuels.

## Revalidation et le CDN

- **`ETag`** / `Last-Modified` permettent des réponses `304 Not Modified` peu coûteuses quand `max-age` expire.
- Un **CDN** met en cache sur des nœuds edge proches des utilisateurs. Utilisez `s-maxage` pour le cache CDN partagé et `stale-while-revalidate` pour servir instantanément du contenu périmé tout en le rafraîchissant en arrière-plan :

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

## Pièges

- Mettre le HTML en cache avec un long `max-age` → les utilisateurs restent bloqués sur d'anciennes versions sans moyen de les invalider.
- `immutable` sur des URL non hachées → vous ne pouvez pas livrer de correctif.

## Pourquoi c'est important

Le cache est le gain de performance le moins cher — il transforme les visites répétées en coût réseau nul et décharge l'origine. Le pattern asset-haché-immuable + HTML-revalidé est le standard de l'industrie ; expliquer *pourquoi* `no-cache` ≠ « ne pas mettre en cache » témoigne d'une réelle profondeur.

La stratégie à deux niveaux

Revalidation et le CDN

Pièges

Pourquoi c'est important

Questions connexes