Co je React.memo? Lze obalit celou aplikaci do memo? Proč je špatné používat memoizaci všude?

React.memo je vyšší komponent, ktorý optimalizuje funkčné komponenty tým, že zabraňuje ich opätovnému renderovaniu, ak sa zmeny v props nezmenili. Porovnáva aktuálne a predchádzajúce props a komponent znovu renderuje iba pri zmene.

Technicky možno celý aplikáciu zabaliť do React.memo, ale to nie je vhodné. Zvyčajne je memoizácia užitočná pre komponenty, ktoré často dostávajú rovnaké props a sú nákladné na renderovanie.

Prečo je zlé používať memoizáciu všade:

• Dodatočné náklady na porovnanie props môžu prevýšiť výhodu z vynechania renderovania.
• Memoizácia komplikuje logiku a ladenie.
• Nie všetky komponenty profitujú z memoizácie, najmä tie jednoduché a rýchle.

Príklad použitia React.memo:

const MyComponent = React.memo(function MyComponent(props) {
  // komponent sa bude znovu renderovať iba pri zmene props
  return <div>{props.value}</div>;
});