Retour à la leçon
Mission

Mission : rendre CatalogPage réactive sans mentir sur la vitesse du filtrage

Corriger une saisie qui semble figée sur un catalogue de 10 000 produits, en choisissant le bon hook de rendu concurrent selon qui possède le state filtré.

Contexte

Sur CatalogPage.jsx, taper dans le champ de recherche provoque un délai visible avant que chaque caractère n'apparaisse : le filtrage de 10 000 produits bloque le thread principal. Un premier développeur enveloppe setResultats(filtrerLourd(valeur)) dans startTransition et annonce fièrement que "le filtrage est maintenant deux fois plus rapide". Un second cas se présente ensuite : un composant CatalogueExterne reçoit termeRecherche en PROP depuis un parent que l'équipe ne contrôle pas, et doit lui aussi éviter de bloquer l'UI pendant son filtrage.