Middle+
Čo je React.memo? Môžeme zabalit celú aplikáciu do memo? Prečo je zlé používať memoizáciu všade?
sobes.tech AI
Odpoveď od AI
React.memo je vyššia komponenta, 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>;
});