Тёмный

Хуки useThrottle/useDebounce в React 

Ayub Begimkulov
Подписаться 11 тыс.
Просмотров 7 тыс.
50% 1

В данном видео я расскажу о там, как правильно в реакт подойти к использованию throttle и debounce. И как обычно, после разбора темы напишем универсальный хук.
Ссылка на codesandbox:
codesandbox.io/s/use-throttle...
Видео о хуке useLatest:
• Продвинутая мемоизация...
Мой канал в Telegram:
telegram.me/ayub_begimkulov_c...

Опубликовано:

 

12 фев 2022

Поделиться:

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист
Посмотреть позже
Комментарии : 22   
@user-kj6go4ft4j
@user-kj6go4ft4j 2 года назад
Вот бы таких учебных материалов побольше было бы. Спасибо большое за информации. Удачи вам!
@ayub_begimkulov
@ayub_begimkulov 2 года назад
Постараюсь чаще выкладывать, спасибо за фидбэк!
@anas4ik777
@anas4ik777 2 года назад
Отличное видео ! Продолжайте в том же духе !
@ayub_begimkulov
@ayub_begimkulov 2 года назад
Спасибо!
@myspace2003
@myspace2003 2 года назад
Спасибо ! Видео помогло ! Удачи вам!
@ayub_begimkulov
@ayub_begimkulov 2 года назад
Рад был помочь!
@user-eu8kf1xb9h
@user-eu8kf1xb9h 7 месяцев назад
Дай бог тебе здоровья, бро!) Просто спас!)
@ayub_begimkulov
@ayub_begimkulov 7 месяцев назад
Рад, что было полезно) спасибо!
@user-vq8zi4ne7s
@user-vq8zi4ne7s 2 года назад
Наконец-то понятное объяснение, огонь!
@ayub_begimkulov
@ayub_begimkulov 2 года назад
Спасибо, рад помочь!
@amina_tulips
@amina_tulips Год назад
Замечательно всегда удачи вам!
@ayub_begimkulov
@ayub_begimkulov 11 месяцев назад
Спасибо большое!
@sia4281
@sia4281 Год назад
Супер!
@ayub_begimkulov
@ayub_begimkulov Год назад
Спасибо!
@dever312
@dever312 Год назад
Бро я дальше useCallback и useMemo перестал понимать. Точнее, думаю можно же ведь обойтись без всего следующего. Или у меня уровень еще не тот, и не сталкивался с такими проблемами. А так awesome.
@druf5962
@druf5962 Год назад
жаль TS нету
@ayub_begimkulov
@ayub_begimkulov Год назад
В планах есть переснять эти видосы. Так что все будет!
@vitaliibudkin8210
@vitaliibudkin8210 11 месяцев назад
Сложная тема!
@ayub_begimkulov
@ayub_begimkulov 11 месяцев назад
Тут кажется самая сложная часть - это useLatest в связке с useMemo. Остальное легко должно быть понять.
@sergei_sergeevu4
@sergei_sergeevu4 2 года назад
Печально, мои комментарии почему-то банит и удаляет ютуб, возможно из-за ссылок, придется как-то без них обойтись ( Подскажите пожалуйста, в видео вы передаете const debouncedFn = useMemo( useMemo( () => debounceFn((...args) => { latestCb.current(...args); }, ms --> параметры lodash), [ms - параметры lodash, latestCb] ); В вашем блоге, описан пример с TS, на github правильно) return useMemo( () => debounce((...args: Paramters) => { unstable_batchedUpdates(() => { latestCb.current(...args); }); }, --> тут не хватает параметров lodash), [latestCb, ...rest] ); Понравилось, что в хуке можно передавать параметры и функция не вызывается сразу Как например, react-use: useTimeoutFn (типо useDebounce или useDebounceFn) Так наверное сделано из-за того, что функция вызывается сразу в useEffect -> set() - который ничего не знает про параметры У них, useDebounce(типо useDebounceEffect) Заметил, что многие библиотеки предоставляющие useDebounce, используют lodash. Например: alibaba/hooks Возможно, в одном из следующих уроков, вы рассмотрите реализацию собственного debounce подобной с lodash)
@ayub_begimkulov
@ayub_begimkulov 2 года назад
По поводу других реализаций - согласен, тоже мне сильно не понравились. А касательно debounce из lodash - это просто проще всего. Но если ты посмотришь на хук, который я делал для библиотеки tiny-use-debounce, там можно создать хук со своей реализацией. Просто сложно удовлетворить разные детали debounce’а, поэтому все берут lodash - самый навороченный и популярный как дефолт. А кастомную реализацию думаю не имеет смысла снимать - такого уже очень много, вряд ли я что-то добавить смогу)
Далее
Хуки useDebounceEffect/useThrottleEffect
14:00
Просмотров 1,1 тыс.
React Custom Hooks: useDebounce - Simply Explained!
10:38
Задержали в аэропорту
00:56
Просмотров 276 тыс.
🎤Пою РЕТРО Песни ✧˖°
3:04:48
Просмотров 1,7 млн
Learn Debounce And Throttle In 16 Minutes
16:28
Просмотров 178 тыс.
Search in React using debouncing | useCallback
12:18
Просмотров 26 тыс.
Задержали в аэропорту
00:56
Просмотров 276 тыс.