Performance et Memoization

Partie du cours React

Votre application affiche un tableau de deux mille lignes avec un champ de recherche au-dessus. Chaque frappe est laborieuse : vous tapez, et la lettre apparaît une demi-seconde plus tard. Rien n'est cassé, et le code semble raisonnable. Ce qui se passe, c'est qu'un seul caractère saisi dans le champ de recherche oblige React à réexécuter chacun de ces deux mille composants de ligne, à constater que presque aucun...

React refait ses rendus librement, et c'est voulu. La plupart du temps c'est exactement ce qu'il faut, parce qu'exécuter la fonction d'un composant coûte peu et que React sait très bien calculer le minimum à modifier sur la page. Parfois ce n'est pas le bon choix, et pour ces cas React vous donne trois outils qui disent « ce résultat n'a pas changé, réutilise le précédent ».