SWR

React 🟡 Mid

Définition

Librairie de fetching de Vercel basée sur la stratégie stale-while-revalidate : affiche les données en cache immédiatement, puis revalide en arrière-plan.

Analogie

Comme un journal du matin : tu lis celui d'hier (cache) en attendant que le facteur apporte le nouveau (revalidation).

Exemple de code

import useSWR from 'swr';

const fetcher = (url) => fetch(url).then(r => r.json());

function Profile() {
  const { data, error, isLoading } = useSWR('/api/user', fetcher);
  if (isLoading) return <Spinner />;
  return <p>{data.name}</p>;
}

Cas d'usage

Alternative plus légère a TanStack Query pour des cas de fetching simples.

#data-fetching#ecosystem

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