Учимся использовать useMemo, useCallback и React.memo | подводные камни | JavaScript, React

В уроке пройдёмся по хукам мемоизации в Реакт, посмотрим как их правильно использовать, в каких случаях лучше использовать.
🍀 Поддержать канал: https://www.donationalerts.com/r/webe...
☕️ Купить кофе: https://buy.stripe.com/5kA7sL9574SG7x...
🎨 Купить набор кистей Procreate: https://webelart.com/illustration.
✍️ Мой telegram channel: https://t.me/webelart
🏰 Английский YouTube: @webelart_en
💁🏼‍♀️ Инстаграм:   / webelart  
🦄 LinkedIn:   / webelart  

Ссылки используемые в уроке:
😌 Проект на Github https://github.com/liveldi/youtube_re...
😌 Рекурсия и стек в JavaScript на примерах: factorial, fibonacci, flatten:    • Рекурсия и стек в JavaScript на приме...  

Статьи используемые для подготовки:
❤️‍🔥 Understanding useMemo and useCallback — https://www.joshwcomeau.com/react/use...
❤️‍🔥 Why React Re-Renders — https://www.joshwcomeau.com/react/why...
❤️‍🔥 Before you Memo — https://overreacted.io/before-you-memo/
❤️‍🔥 React without memo —    • React without memo  
❤️‍🔥 When to use React.useCallback() — https://aheadcreative.co.uk/articles/...
❤️‍🔥 Understanding when to use useMemo — https://maxrozen.com/understanding-wh...

Коллеги, которые помогли ссылками:
😎   / ivanslo  
😎   / artemtsviliy  

00:00 Введение.
02:20 Вступление в проект на next.js
03:25 Теория useMemo, useCallback, React.memo
11:30 MyHeavyComponent
14:10 useMemo для тяжёлых вычислений
17:45 Оптимизация без мемоизации
21:40 React.memo — pure component
24:19 Передача объекта в props.
28:50 Передача функций в props.
31:10 Где лучше использовать мемоизацию + примеры из жизни.

На канале я рассматриваю различные темы веб-разработки, на текущий момент: веб-основы, веб-анимации, веб-дизайн.