cacheLife, cacheTag, updateTag, refresh

React 🔴 Senior

Définition

Fonctions de next/cache qui pilotent une portée 'use cache' (Next.js 16, 21 octobre 2025). cacheLife(profil) fixe stale (client), revalidate (régénération en arrière-plan) et expire ; profils intégrés seconds, minutes, hours, days, weeks, max, default (5 min / 15 min / jamais). cacheTag(tag) étiquette l'entrée. Côté mutation : revalidateTag(tag, profil) pour du stale-while-revalidate, updateTag(tag) dans une Server Action pour relire immédiatement ses écritures, refresh() pour rafraîchir les données non cachées.

Analogie

Les dates sur un emballage : « à consommer de préférence » (revalidate) et « à consommer jusqu'au » (expire), plus une étiquette (tag) pour retirer un lot du rayon.

Exemple de code

import { cacheLife, cacheTag, updateTag } from 'next/cache';

export async function getPost(slug: string) {
  'use cache';
  cacheLife('days');           // stale 5 min, revalidate 1 j, expire 1 sem
  cacheTag(`post-${slug}`);
  return db.posts.find(slug);
}

'use server';
export async function savePost(slug: string, data: Post) {
  await db.posts.update(slug, data);
  updateTag(`post-${slug}`);   // l'auteur relit sa modif immédiatement
  // revalidateTag('posts', 'max') => SWR ; refresh() => données non cachées
}

Cas d'usage

Blog ou catalogue : longue durée de vie + invalidation à la sauvegarde ; flux qui bouge dans la journée : profil hours ou minutes.

Anti-pattern

Omettre cacheLife (profil default implicite, comportement dépendant des caches imbriqués) ou imbriquer un cache court dans un cache sans durée explicite : erreur au pré-rendu.
#nextjs#caching

Fiche mise à jour le 2026-09-27

← → au clavier pour passer d'une fiche à l'autre