Chapitre 12 : Memo/Callback

1. Problème de performance

React re-calcule certaines valeurs ou re-crée des fonctions à chaque rendu, ce qui peut être gourmand en ressources si le calcul est complexe ou si l'enfant dépend d'une référence stable.

2. useMemo

useMemo mémorise le résultat d'un calcul.

const calculComplexe = useMemo(() => {
  return performance Intensive(a, b);
}, [a, b]);

3. useCallback

useCallback mémorise la définition d'une fonction pour éviter qu'elle soit re-créée inutilement.

const handleClick = useCallback(() => {
  console.log("Cliqué !");
}, []);

4. Section Quiz

Testez vos connaissances sur les Hooks avancés.