TanStack Query

React 🟡 Mid

Définition

Librairie de gestion de l'état serveur (fetching, caching, synchronisation). Gère automatiquement le cache, la revalidation, le retry et les mises a jour optimistes.

Analogie

Comme un concierge d'hôtel : il anticipe tes besoins, garde tes affaires en cache et les rafraîchit discrètement.

Exemple de code

const { data, isLoading } = useQuery({
  queryKey: ['users', userId],
  queryFn: () => fetch(`/api/users/${userId}`).then(r => r.json()),
  staleTime: 5 * 60 * 1000,
  gcTime: 10 * 60 * 1000,
});

Cas d'usage

Toute application qui consomme une API REST/GraphQL et a besoin de cache intelligent et de revalidation.

Anti-pattern

Stocker le résultat de useQuery dans un useState local, duplicant l'état et perdant le cache.

Termes liés

#data-fetching#interview#ecosystem

En entretien

  1. Explique-moi à quoi sert TanStack Query.

    C'est une librairie de gestion de l'état serveur qui gère automatiquement le cache, la revalidation, le retry et les mises à jour optimistes, comme un concierge d'hôtel qui anticipe tes besoins et garde tes affaires en cache. Elle est utile dans toute application qui consomme une API REST/GraphQL.

  2. Quel est le piège classique avec TanStack Query ?

    Stocker le résultat de useQuery dans un useState local, ce qui duplique l'état et fait perdre le bénéfice du cache. Il vaut mieux consommer directement data et isLoading renvoyés par useQuery.

Fiche mise à jour le 2026-09-27

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