Qu'est-ce que React.memo ? Peut-on envelopper toute l'application dans un memo ? Pourquoi est-il mauvais d'utiliser la mémorisation partout ?

React.memo est un composant de haut niveau qui optimise les composants fonctionnels en évitant leur re-rendu si les props ne changent pas. Il compare les props actuelles et précédentes et ne re-renderise le composant que si nécessaire.

Techniquement, on peut envelopper toute l'application dans React.memo, mais ce n'est pas conseillé. La mémorisation est généralement utile pour les composants qui reçoivent souvent les mêmes props et qui sont coûteux à rendre.

Pourquoi il est mauvais d'utiliser la mémorisation partout :

• Les coûts supplémentaires de comparaison des props peuvent dépasser les bénéfices de l'économie de rendu.
• La mémorisation complique la logique et le débogage.
• Tous les composants ne bénéficient pas de la mémorisation, surtout les simples et rapides.

Exemple d'utilisation de React.memo :

const MyComponent = React.memo(function MyComponent(props) {
  // le composant ne sera rerendu que si les props changent
  return <div>{props.value}</div>;
});