Retour à la leçon
Mission

Mission : le useCallback qui n'a jamais rien optimisé

Diagnostiquer une mémoïsation inutile faute de memo() côté enfant, et corriger une dépendance objet recréée à chaque rendu.

Contexte

Sur CatalogPage.jsx, un développeur a ajouté useCallback autour de gererClic en pensant accélérer l'affichage, mais le Profiler React montre que BoutonAction (un composant enfant simple, sans memo()) se re-rend quand même à chaque frappe dans le champ de recherche, exactement comme avant. Un peu plus bas, un autre composant fait const options = { tri: "asc" }; directement dans le corps de la fonction, puis useMemo(() => calcul(options), [options]) : le Profiler montre que ce useMemo recalcule à chaque rendu malgré son tableau de dépendances.