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



В уроке пройдёмся по хукам мемоизации в Реакт, посмотрим как их правильно использовать, в каких случаях лучше использовать.
❤️ Мой telegram: https://t.me/webelart
❤️ Мой Инстаграм канал: https://www.instagram.com
❤️ Английский YouTube: https://www.youtube.com/channel/UCdw1R35g3uDj4LVt1-aS-hA
❤️ Купить кофеее 😍: https://buy.stripe.com/5kA7sL9574SG7xCfZ3

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

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

Коллеги, которые помогли ссылками:
😎 https://twitter.com/ivanslo
😎 https://twitter.com/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 Где лучше использовать мемоизацию + примеры из жизни.

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

Comments are closed.