Что вы знаете о useCallback?

  Рет қаралды 50,020

АйТи Синяк

АйТи Синяк

Күн бұрын

Пікірлер
@0xlex695
@0xlex695 3 жыл бұрын
Просто супер! Какой же огромный труд делать анимацию, да еще и с таким высоким качеством подачи...Ты крут!
@it-sin9k
@it-sin9k 3 жыл бұрын
Спасибо!) это действительно не легкий труд) будем рады если поделитесь видео с коллегами)
@GagikHarutyunyan_dev
@GagikHarutyunyan_dev 3 жыл бұрын
это гигантский труд. Я как то создавал себе анимацию через adobe after effects. Это ад. Там еще нужно иметь супер мега железо, чтобы не зависло.. А процесс создания инфографики очень долгий. Я думаю на анимацию уходит несколько раз больше времени чем на контент
@it-sin9k
@it-sin9k 3 жыл бұрын
я честно говоря даже и не знаю, на что уходит больше времени. Очень много занимает расписывание сценария для видео. В плане на такой-то фразе показать вот этот текст или вот на бумаге нарисовал примерный вид страницы. Вот этот подробный видео сценарий занимает очень много
@ronnieatticus8455
@ronnieatticus8455 3 жыл бұрын
@Jerome Lochlan instablaster :)
@alexandrnasonov
@alexandrnasonov 2 жыл бұрын
@@GagikHarutyunyan_dev Привет рендерам по 8 часов, тут вам не реакт с мемойзами
@d3mon18rus
@d3mon18rus 3 жыл бұрын
боже храни алгоритмы ютуба которые решили порекомендовать мне этот канал :D
@it-sin9k
@it-sin9k 3 жыл бұрын
Аминь :D
@Sashanovoseltsev
@Sashanovoseltsev 9 ай бұрын
Мне пришлось перейти из .Нет бекенд разработки на фронт, поучаствовать в найме, познакомиться со специалистом с реакт навыками гораздо выше моих, признаться ему в этом и спросить где он черпал знания чтобы узнать об этом канале) Так что вам еще повезло 😁
@Elator11777
@Elator11777 4 жыл бұрын
Вот это действительно крутой контент, а не перессказывание документации!
@it-sin9k
@it-sin9k 4 жыл бұрын
Спасибо!) следующие 2 видео которые выйдут на канале, будут еще круче) **по секрету**
@-X-Ray-
@-X-Ray- 4 жыл бұрын
Дивный новый мир хуков, спасибо, очень полезно 👍
@dmitrysvetlov6001
@dmitrysvetlov6001 3 жыл бұрын
хорошее объяснение. хотелось бы по всем хукам такой разбор ) особенно по useReducer. успехов каналу, лайк / подписка.
@it-sin9k
@it-sin9k 3 жыл бұрын
Добро пожаловать!) ну уже как минимум на канале разобраные: useRef, useMemo, коснулись useEffect + useLayoutEffect и новый выпуск во вторник еще раскроет, что-то новое)
@DmitriLipski
@DmitriLipski 4 жыл бұрын
Спасибо за видео! Как всегда качественный контент. Можно ещё про useRef видео
@it-sin9k
@it-sin9k 4 жыл бұрын
Да, про useRef, там есть интересные трюки, однозначно про них будет выпуск
@rib0385
@rib0385 4 ай бұрын
Привет, тут небольшая ошибка 3:55. Eсли произойдет перерендер родительского компонента Test, тем самым Test сам начнет свой перерендер, даже если его пропсы не поменялись. В этом случае функция useCallback вернет закешированный callback, а в примере без useMemo произойдет пересоздание функции. И также в примере компонент Car нужно обернуть в memo, чтобы от мемоизированного коллбека была оптимизация
@it-sin9k
@it-sin9k 4 ай бұрын
да, я так не добавил обертку в memo(). Пропустил этот моментик)
@samatzhetibaev8045
@samatzhetibaev8045 2 жыл бұрын
Видео отличное! У нас на проекте используют часто не по назначению. Подниму эту тему. Благодарю! Придерусь только к названиям обработчиков: 7:57, у них должен быть префикс `handle`. Ты и сам в видео говоришь, о том, что надо обработать (to handle) событие: handleClick, handleChange, handleSubmit, handleMyOwnClick, etc. Если это событие передаётся дальше как пропс, то префикс будет `on`: onClick, onChange, onSubmit, onMyOwnClick, etc. Ещё раз благодарю за видео! :)
@it-sin9k
@it-sin9k 2 жыл бұрын
Интересный подход к неймингу. Подниму этот вопрос в команде, интересно, кто как отреагирует :)
@viktorsoroka4510
@viktorsoroka4510 4 жыл бұрын
Отличный контент. Я бы ещё отметил что также приходится мемоизировать когда функции указываются в зависимостях тех же тех же useErffect или useMemo.
@it-sin9k
@it-sin9k 4 жыл бұрын
спасибо за комментарий! Я в данный момент намеренно не касался этих примеров, т.к. в следующих выпусках планирую про это поговорить более углубленно :)
@viktorsoroka4510
@viktorsoroka4510 4 жыл бұрын
@@it-sin9k Супер. Рад что покрывашь эти темы :) Кстати сколько времени уходит что бы смонтировать видео? Картинка получается супер, просто интересно почему в итоге допустим не выбрал обычный вариант например как делает Kent C. Dodds, который как мне кажется занимал бы меньше времени.
@it-sin9k
@it-sin9k 4 жыл бұрын
нас двое, я придумываю контент, записываю аудио и делаю текстовый драфт по визуализации и есть еще товарищ, который делает всю работу по видео ряду, рисует персонажей, делает разные визуальные эффекты и прочее. Поэтому сумарно это занимает очень много времени, посчитать особо не могу. Лишь один контент осознать и продумать подачу у меня занимает пару дней, по факту это как статью придумать и написать. Синяк - это единственный формат контента, который я бы сам стал смотреть. 5 - 10 минут, осознанного текста, с минимизированным количеством лишней информации (скрыт лишний код, лишние контролы в браузере и многое другое), с крупными шрифтами, чтобы смотреть на телефоне было удобно + фокус кода, чтобы понимать о чем речь идет, да и визуализация идеи какого либо патерна сильно упрощает его понимание, это то что смотрел бы я сам. В подаче Kent C. Dodds такого нет, тогда уж лучше по мне прочесть статьи какие-нибудь, чем смотреть длинные ролики с говорящей головй и перегруженным экраном. А я люблю все таки видео формат, поэтому и решил сделать, то что сам бы смотрел.
@dm.hol.3624
@dm.hol.3624 3 жыл бұрын
Респект за коммент, ради таких всегда их читаю.
@БатырбекАйгалиев
@БатырбекАйгалиев 4 жыл бұрын
Спасибо за видео! Перепишу сегодня парочку компонентов)
@it-sin9k
@it-sin9k 4 жыл бұрын
С этим комментарием цель данного видео считаю достигнутой))
@underpog5347
@underpog5347 4 жыл бұрын
А в конце видео компонент не нужно обернуть в React.memo что бы useCallback внутри компонента имел какой-то смысл?
@it-sin9k
@it-sin9k 4 жыл бұрын
Абсолютно верно, необходимо использовать React.memo, я как то опустил в визуализации этот момент. Вероятно стоило добавить
@underpog5347
@underpog5347 4 жыл бұрын
@@it-sin9k Спасибо за ответ, очень полезное видео
@serhiirumiantsev7736
@serhiirumiantsev7736 4 жыл бұрын
Да, круто объяснил насчёт создания функции, но как по мне useCallback надо использовать только в связке с React.memo
@it-sin9k
@it-sin9k 4 жыл бұрын
В большинстве случаев да, но есть и другие более редкие кейсы, когда тебе нужна одна и та же ссылка на функцию. Например если у тебя есть window.addEventListener и window.removeEventListener, в таком случае нужно так же передать одну и туже функцию, иначе ты не сможешь отписаться от события.
@serhiirumiantsev7736
@serhiirumiantsev7736 4 жыл бұрын
@@it-sin9k ну ты конечно высаживаешь.... Найдешь редкий кейс, круто. Спасибо.
@MACHETE912
@MACHETE912 4 жыл бұрын
Качественный контент, спасибо!
@it-sin9k
@it-sin9k 4 жыл бұрын
Спасибо!)
@muratx10
@muratx10 4 жыл бұрын
контент бомба! спасибо добрый Синяк! скину ребятам видос. 🔥
@it-sin9k
@it-sin9k 4 жыл бұрын
Мы рады быть полезными :) Рекомендую еще в твитер подписаться, пользы там не много, но иногда провожу опросы, какие темы хотели бы послушать
@muratx10
@muratx10 4 жыл бұрын
@@it-sin9k Обязательно! 👌
@ИгорьБарбашов-т7ц
@ИгорьБарбашов-т7ц 4 жыл бұрын
Не совсем понял мысль на 8:50 минуте - почему в этом случае нет смысла использования useCallback? Про оборачивание какой функции идет речь: onClick в или onCarClick в ?
@it-sin9k
@it-sin9k 4 жыл бұрын
Идея в том чтобы оборачивать в useCallback метод onCarClick, который находится в компоненте Cars. Это нужно для того чтобы компонент Car получал одну и туже ссылку на функцию, тогда компонент Car можно обернуть в memo и благодаря тому что ссылка на функцию будет одна и таже, компонент Car не будет заново рендериться, на каждый чих родителя. С другой стороны внутри компонента Car нет смысла оборачивать onClick. useCallback(() => onCarClick(car), [onCarClick, car]). Потому что нам нет нужды в одной и той же ссылке, пусть на каждый render функция новая передается в
@ИгорьБарбашов-т7ц
@ИгорьБарбашов-т7ц 4 жыл бұрын
@@it-sin9k да, я про это и спрашивал - какая функция имеется в виду в этом моменте (ппросто там явно не озвучено), в таком варианте - да, все ясно
@GreenTech1256
@GreenTech1256 3 жыл бұрын
@@it-sin9k > компонент Car не будет заново рендериться, на каждый чих родителя. На сколько я знаю компонент рендериться при новых пропсах или стейте и получается при новых пропсах ({cars}) компонент будет рендериться и за счет этого его потомки тоже Т е useCallback в тоже не имеет смысла?
@it-sin9k
@it-sin9k 3 жыл бұрын
Если компонент Car не обернут в memo, тогда Car будет рендериться абсолютно при любом рендере родителя. В данном примере я подразумевал, что компонент Car обернут в memo. Это значит, что компонент Car будет рендериться, только в случае, если хотя бы один из props изменится. Одним из таких props может быть функция onCarClick. Если мы не обернем ее в Cars в useCallback, тогда мы будет передавать новую ссылку на функцию, при каждом рендере Cars, а это значит что абсолютно все компоненты Car будут рендериться. Поэтому и оборачивается в useCallback, для того чтобы мемоизировать функцию, и каждый раз в props передавать одну и ту же ссылку на функцию onCarsClick
@_ivanoleksiuk
@_ivanoleksiuk 2 жыл бұрын
1. Немного не понял зачем нам создавать новую функцию из пропа в компоненте , почему мы не можем в return сам проп функции передать? 2. А если бы нам нужен был ивент, можем ли мы просто сделать onCarClick(car, event) }> ? 3. Видел что снизу в коментах про мемо речь ишла. Так нужно ещё и саму функцию в useMemo hook? Или компонент в memo HOC? Видосы топ! Качество огонь. Подача для джунов - на высоте! Побольше контента, спасибо! Будем лайкать и коментировать, а также ДОНАТИТЬ)))
@it-sin9k
@it-sin9k 2 жыл бұрын
1. Дело в том что компонент Car обернут в memo(). Соответственно чтобы избежать лишних рендеров, нужно передавать ссылку на одну и ту же функцию, а если создавать функцию снаружи, то вы каждый раз передаете новую ссылку на функцию. Да и саму функцию создаете, на каждый рендер листа, а если он в компоненте, то функция создавалась бы только при перерендоре 2. Так и сделано же 3. Для функции есть useCallback, а не useMemo. Да при работе с листами, чтобы передавать одну и ту же ссылку на функцию лучше обернуть ее в useCallback
@_ivanoleksiuk
@_ivanoleksiuk 2 жыл бұрын
​@@it-sin9k, спасибо большое за ответ, но все же, либо я туплю, либо вы не совсем поняли вопрос 1. У меня ситуация идентичная как у вас в примере, за исключением того, что функция onCarClick принимает кроме car, ещё и event. Так вот. 1. В обернул объявление функции в useCallback, чтобы ссылка оставалась прежней. 2. Обернул компоненту в memo-HOC. 3. Но в я НЕ создаю по новой "const onClick = () => onCarClick(car, event)", по тому что, в return нужно ивент "поймать". Тоесть получается "return ( onCarClick(car, event)} />)" - каждый раз анонимная функция передается. Если бы я объявил ранее, то как бы переданая ссылка ивент поймала? Либо я просто не знаю как правильно сделать :( Как тогда оптимизировать?
@it-sin9k
@it-sin9k 2 жыл бұрын
​@@_ivanoleksiukНе вижу в этом никакой сложности, вы вполне можете написать следующий код: const onClick = (event) => onCarClick(event, car) return click me
@_ivanoleksiuk
@_ivanoleksiuk 2 жыл бұрын
@@it-sin9k спасибо большое! Не знал что так работать будет. У меня два аргумента в функции, один из них ивент. Я думал будет работать если только два передавать. Думал всегда нужно анонимную с указанием двух. Не понимаю откуда берет второй (указываю "const onClick = (event) => onCarClick(event);" и работает). Но ничего - разберемся!
@zooyotz
@zooyotz Жыл бұрын
Почему у этого канала еще не миллион подписчиков?)
@it-sin9k
@it-sin9k Жыл бұрын
Для этого React-у надо хотя бы 1млрд скачек в неделю)
@denichi872
@denichi872 2 жыл бұрын
Привет видео класс. Хочу попросить вставлять в описание к видео ссылку на статью, твои же многие видео имеют статью на хабре. Полезно после просмотра еще и почитать то же самое, лучше закрепляется)
@it-sin9k
@it-sin9k 2 жыл бұрын
Тут 2 проблемки :) - Не хочу трафик с ютуба на хабр отправлять, идея была скорее наоборот) - ну и статьи давно перестал выпускать новые, что то комменты на хабре иногда меня очень расстраивали. Комменты на ютубе куда более приятно читать и отвечать людям Есть мысли сделать свой ресурс, куда расшифровки публиковать, тогда точно буду постить)
@denichi872
@denichi872 2 жыл бұрын
@@it-sin9k логично, я и не подумал об этом)
@СэмФишер-х4д
@СэмФишер-х4д 2 жыл бұрын
блин, какой же офигенный материал. уже несколько дней смотрю по чуть-чуть. очень грамотно даешь информацию, еще и докуху разжевываешь. спасибо!
@it-sin9k
@it-sin9k 2 жыл бұрын
Ради таких бесценных комментариев мы и стараемся)
@СэмФишер-х4д
@СэмФишер-х4д 2 жыл бұрын
@@it-sin9k планируются ли какие-то курсы по реакту?
@it-sin9k
@it-sin9k 2 жыл бұрын
@@СэмФишер-х4д что то подобное планируется, но будет думаю еще не скоро, платформу решили свою запилить для этого. Там много идей, что на ней можно запилить
@СэмФишер-х4д
@СэмФишер-х4д 2 жыл бұрын
@@it-sin9k думаю такой курс был бы один из лучших в ру-регионе.ждем запуска платформы тогда)
@it-sin9k
@it-sin9k 2 жыл бұрын
@@СэмФишер-х4д очень на это надеюсь) но надо набраться терпения)
@agfasgasasgasgas
@agfasgasasgasgas 2 жыл бұрын
Приятно, что хоть кто-то делает контент не для начинающих )
@it-sin9k
@it-sin9k 2 жыл бұрын
сам страдал, что не хватает контента для себя. Вот решил его сам создать)
@andrewginter8790
@andrewginter8790 3 жыл бұрын
Спасибо, очень полезно!
@srt2046
@srt2046 4 жыл бұрын
Ещё один шикарный ролик!💪
@blgarOk
@blgarOk 2 жыл бұрын
Забыл одну важную деталь. Что бы этот трюк с useCallback работал, нужно чтобы дочерний компонент был оптимизирован от лишних ререндеров. Например, в родитель прилетает новый пропс, это тригерит ререндер родителя и всего поддерева, вне зависимости обернут колбек в useCallback или нет. Справедливости ради, в твоем примере родитель не имеет своего локального состоятия или пропсов используемых только в родителе, поэтому у тебя все корректно. Но все же в общем случае, даталь описанную выше, нужно учитывать.
@hikarukun5126
@hikarukun5126 2 жыл бұрын
Плюсую, React.memo(Component) в помощь
@arturbilyi1010
@arturbilyi1010 3 жыл бұрын
Топовое объяснение! Перед собесами мега полезно)
@vidjentukvidjentuk8644
@vidjentukvidjentuk8644 2 жыл бұрын
Рад ,что нашёл твой канал бро, очень сильно все преподносишь!!
@it-sin9k
@it-sin9k 2 жыл бұрын
спасибо! Мы рады что ты нас нашел))
@pavlof
@pavlof 2 жыл бұрын
это очень круто!!! по возможности побольше хотелось-бы "своих реализаций", как в случае с useCallback или разбор source code-а
@it-sin9k
@it-sin9k 2 жыл бұрын
На этом канале много видео с разбором исходников :)
@Sylar7891
@Sylar7891 3 жыл бұрын
8:54 почему ьы сращу не передать onCarClick (car) в Button а создавать специально функцию?
@it-sin9k
@it-sin9k 3 жыл бұрын
В конкретно этом видео, для наглядности. А в реальных проектах, мы обычно на 100% разделяем логику и отображение. Поэтому этот код у меня был бы в хуке кастомном, где я подготавливаю все данные для компонента
@vitaliydrapkin3748
@vitaliydrapkin3748 2 жыл бұрын
Я просто в шоке насколько крутой контент и как хорошо и просто ты объясняешь) спасибо тебе огромное)
@it-sin9k
@it-sin9k 2 жыл бұрын
Спасибо!
@AlexanderEmashev
@AlexanderEmashev 3 жыл бұрын
Мое почтение! Отличная анимация и подача!
@it-sin9k
@it-sin9k 3 жыл бұрын
спасибо!) мы работаем над ее улучшением)
@АнатолийГорбов-о1ь
@АнатолийГорбов-о1ь Жыл бұрын
Это лучшее видео и самое понятное по этому хуку! спасибо!
@it-sin9k
@it-sin9k Жыл бұрын
Спасибо! Надеюсь найдете себе еще что-то полезное на канале)
@vladthorenco2675
@vladthorenco2675 3 жыл бұрын
Очень круто сделано, мультики про React это новое) Поделился с коллегами ссылкой
@it-sin9k
@it-sin9k 3 жыл бұрын
За "Поделился с коллегами ссылкой" огромное спасибо!)
@edgarmkrtchyan9607
@edgarmkrtchyan9607 10 ай бұрын
завтра буду смотреть,брат советовал
@it-sin9k
@it-sin9k 10 ай бұрын
привет передавай брату!)
@awakeupcall5336
@awakeupcall5336 Жыл бұрын
8:52 - не совсем понял, почему в данном случае неважно, почему не юзать useCallback на этом уровне - какой критерий, на каком уровне остановиться? Можете объяснить другими словами подробнее?
@it-sin9k
@it-sin9k Жыл бұрын
Привет :) давайте попробуем пойти от обратного, а почему здесь нужен useCallback? После вашего ответа, мне будет проще понять, ход ваших мыслей)
@awakeupcall5336
@awakeupcall5336 Жыл бұрын
@@it-sin9k ход моих мыслей - полный хаос с этой меморизацией в голове, вроде много лет продакшн опыта, но никто в командах никогда не уделял этому такое внимание и писали почти везде useCallbak на каждый хендлер. Но тут возможно имеет место быть и атомарность данного компонента, так что тут useCallback бессмысленен, button не может обновиться без обновления внешнего Button по идее
@it-sin9k
@it-sin9k Жыл бұрын
@@awakeupcall5336 "тут useCallback бессмысленен, button не может обновиться без обновления внешнего Button по идее" (с) А даже если компонент обновится по другой причине и onClick создастся заново. Какой вред это причин по вашей версии?
@aleksandrmatyka3118
@aleksandrmatyka3118 3 жыл бұрын
Нужно сделать запрос, чтобы некоторые ваши ролики делали как отдельный на сайте реакт документации)
@it-sin9k
@it-sin9k 3 жыл бұрын
Было бы очень не плохо)))
@eugeniyvinnikov5480
@eugeniyvinnikov5480 3 жыл бұрын
Боже мой, спасибо тебе ) наконец-то понял необходимость useCallback )
@it-sin9k
@it-sin9k 3 жыл бұрын
Сам немного был шокирован, когда осознал))
@mikhailstepanischev8316
@mikhailstepanischev8316 3 жыл бұрын
Спасибо,супер выпуск ! useCallback
@virginia_dj
@virginia_dj 3 жыл бұрын
Суть useCallback в том, что someFunction будет мемоизирована И react не будет ререндерить атрибут onClick тега button, потому что someFunction мемоизирована (если конечно title не изменился) Поэтому данное видео для понимания useCallback под копотом хорошее, но неверное Поправьте если не прав
@it-sin9k
@it-sin9k 3 жыл бұрын
Похожая дискуссия происходила на хабре, если интересна выжимка (я придерживаюсь того же мнения), то склонялись к тому что onClick пере присвоить (addEventLister / removeEventListener) дешевле чем прогонять данные через useCallback. И читабельность ухудшается. Вот ссылка на тред, более подробно почитать можно мысли разных людей habr.com/en/post/529950/#comment_22379830
@yulia_kotlyar
@yulia_kotlyar 4 жыл бұрын
Спасибо, было полезно и понятно!
@mayday4977
@mayday4977 2 жыл бұрын
Благодарю за труды и годнейший контент!
@armensargsyan8981
@armensargsyan8981 Жыл бұрын
топ спасибо за труды. Можно вопрос про часть (Таким образом все компоненты Car не будут рендериться лишний раз, т.к. ссылка на функцию останется прежней.) это утверждение верно если Car обернут в memo так? 8:35 минута.
@it-sin9k
@it-sin9k Жыл бұрын
Абсолютно верно :)
@maxvas7267
@maxvas7267 2 жыл бұрын
Жииииирный лайк! Супер простое и наглядное объяснение
@arman-6172
@arman-6172 2 жыл бұрын
Большое спасибо за труд, какой день изучаю этот useCallback =) немного не понял в конце 8:45 когда сам дочерний компонент обвернул в свою функцию. что изменилось что не нужно родителю использовать useCallback ? какие признаки должны быть когда точно нужно юзать useCallback?
@it-sin9k
@it-sin9k 2 жыл бұрын
то что делается на 8:45 работает вместе с useCallback. А как еще передать параметры?
@arman-6172
@arman-6172 2 жыл бұрын
​@@it-sin9k А если заглянуть внутрь компонента Car. там мы создадим еще одну функцию, которая свяжет onCarClick и объект car. В этом случае нет никакой пользы оборачивать метод в useCallback, т.к. нам не важно, ссылка это на функцию с прошлого рендера или с текущего рендера... тут наверно про использование нового useCallback уже для Car? Наверно я не так понял, думал что продолжаете говорить про родительский useCallback, что в нем теперь нет необходимости. Спасибо!)
@it-sin9k
@it-sin9k 2 жыл бұрын
useCallback у родительского компонента нужен был, чтобы при рендере списка машин, все компоненты Car не обновлялись, чтобы все получали одну и ту же ссылку. А внутри Car там уже не важно, что мы передаем в onClick. На уровне DOM дерева можно и разную ссылку передавать, это дешевая операция
@arman-6172
@arman-6172 2 жыл бұрын
@@it-sin9k благодарю. Я затупил 🤷‍♂️
@lomeat
@lomeat 4 жыл бұрын
Внезапно правда хороший видос. Про этот "нюанс" знал, но уровень подачи материала на уровне. Разве что в какой-то момент объяснение кажется сверх-монотонным, а в какой-то слишком быстро проматывающим основные моменты. Например зачитывание на экране того, что я могу поставить на паузу и сам быстро прочитать. А потом скип, когда пишется функция useCallback.
@it-sin9k
@it-sin9k 4 жыл бұрын
Спасибо за фидбек! а можете уточнить что вы подразумеваете под "скип, когда пишется функция useCallback?" что именно хотелось бы добавить?
@lomeat
@lomeat 4 жыл бұрын
@@it-sin9k когда показывалась реализация функции вместе с ее условиями, то например, мне хотелось самому же прочитать эти условия, так сказать зафиксировать их у себя в голове, а не просто пробежаться по ним. Как бы там не было ничего сложного, но хочется большой остановки на этом. Смотрю сейчас доклад, как же бодро ты рассказываешь, хочу с тобой работать)
@it-sin9k
@it-sin9k 4 жыл бұрын
Я просмотрел заново видос) понял о чем ты говоришь, я специально не останавливался особо на реализации useCallback, потому что через пару видео планирую эксперементальное видео, рассмотреть исходники реакта. Т.е. все смогут подробно увидеть, что примерно происходит под капотом. Конечно всю кодовую базу не получится раскрыть, но что-то получится
@koreikin
@koreikin 2 жыл бұрын
крутой контент, почему так мало подписчиков и просмотров. Не понимаю, почему только сейчас спустя можно сказать 2х лет ютьюб предложил ваши видео. Очень четкая и поставленная речь(только благодаря ей уже включаешься в осмысление темы) , продуманный текст, столько трудов.
@it-sin9k
@it-sin9k 2 жыл бұрын
Спасибо! Трудов действительно много) а алгоритмы ютуба не исповедимы))
@VeaceslavBARBARII
@VeaceslavBARBARII Жыл бұрын
Спасибо
@srt2046
@srt2046 4 жыл бұрын
Бро, ты реально крут. Делай дальше и чаще) Я от Арчакоаа. Подписался, нажал колокольчик
@it-sin9k
@it-sin9k 4 жыл бұрын
Спасибо!) делать дальше это без проблем) а вот с чаще немного сложно. Сам контент, каждый выпуск это как статью на хабре написать (по некоторым выпускам мы и публикуем статьи), выматываем достаточно, а еще и видео ряд нужно придумать и смонтировать) Поэтому текущая наша скорость 1 видео раз в 2 недели
@srt2046
@srt2046 4 жыл бұрын
@@it-sin9k Успехов желаю) буду ждать каждый выпуск 💪
@Mark-wn4op
@Mark-wn4op 2 жыл бұрын
Смех, смехом, но буквально вчера делал тестовое где примеры с useCalback были точь в точь как в твоём видосе;)
@it-sin9k
@it-sin9k 2 жыл бұрын
ахах) возможно по видео и составляли тестовое)
@artempavlenko5147
@artempavlenko5147 3 жыл бұрын
Отличная подача полезного контента.
@it-sin9k
@it-sin9k 3 жыл бұрын
Спасибо :) мы очень старались)
@sergiogusto
@sergiogusto 2 жыл бұрын
8:34 А что на счет функции высшего порядка в данном случае? А вообще, красавчик. Очень хороший разбор
@it-sin9k
@it-sin9k 2 жыл бұрын
Спасибо :) не уловил суть вопроса про функцию высшего порядка
@sergiogusto
@sergiogusto 2 жыл бұрын
​@@it-sin9k вместо юсКолбэк можно использовать функцию высшего порядка и в первом аргументе получаем результат функции вызванной в мапере на обработчик онКарКлик={функция(car)}. Не могу написать код, потому что ютюб его удаляет (((
@sergiogusto
@sergiogusto 2 жыл бұрын
@@it-sin9k надеюсь доступно объяснил
@it-sin9k
@it-sin9k 2 жыл бұрын
@@sergiogusto Так функция высшего порядка вернет всегда новую ссылку в onCarClick. Что ломает memo. А useCallback занимается именно кешированием старой функции
@Quentinrei
@Quentinrei Жыл бұрын
Круто, очень круто 🎉🎉🎉🎉
@fedor_U
@fedor_U 2 жыл бұрын
Крутое видео и отличное объяснение. Спасибо!
@it-sin9k
@it-sin9k 2 жыл бұрын
Спасибо!)
@ДанилаБелоглазов-е1ю
@ДанилаБелоглазов-е1ю 2 жыл бұрын
Отличная подача материла. Большое спасибо!)
@kostyapolishko6282
@kostyapolishko6282 3 жыл бұрын
Ты вообще 🔥!!!! Все четко, понятно, анимации просто крутые. 100 % лайк и подписка!!!
@it-sin9k
@it-sin9k 3 жыл бұрын
Спасибо!) Добро пожаловать!)
@НикитаГончаров-е8ш
@НикитаГончаров-е8ш 2 жыл бұрын
Я долго размышлял и понял, что в последнем примере ошибка, если я неправ, поправьте меня. Компонент Car все равно будет рендерится. То есть функция будет все равно отрабатывать, единственное, не будет removeEventListenet и addEventListenet . Чтобы действительно не было лишних срабатываний, нужно компонент car обвернуть в memo
@it-sin9k
@it-sin9k 2 жыл бұрын
да, все верно. Я не показал явно, что компонент обернут в React.memo. Без этого не будет работать
@MrKu39
@MrKu39 Жыл бұрын
Обработчики событий также будут обновляться при каждом рендере, так как при перерендере родителя перендеривается Car полностью, соответсвенно функция запускается полностью по новой
@НикитаГончаров-е8ш
@НикитаГончаров-е8ш Жыл бұрын
@@MrKu39 Если функция в `useMemo` и обработчик в `useCallback`, то функция не будут срабатывать без изменения пропсов сверху или стейтов внутри
@MrKu39
@MrKu39 Жыл бұрын
@@НикитаГончаров-е8ш Да , все верно. Но только компонент в React.memo. Не совсем понял про removeEventListener и addEventListener. Почему они не будут срабатывать? Да и операция простейшая , имхо она легче чем useCallback
@НикитаГончаров-е8ш
@НикитаГончаров-е8ш Жыл бұрын
@@MrKu39 если добавить useCallback, но не добавлять React.memo, как в примере из видео, то оптимизация сведется к тому, что компонент (функция) все равно будет полностью срабатывать, будет видеть, что обработчик функции не изменился и не будет лишнего removeEventListenet и addEventListenet, которые были бы без useCallback
@MrGreen-zs7on
@MrGreen-zs7on 3 жыл бұрын
Спасибо за такой контент, канал просто бомба! Главное только что бы выход контента не пострадал из за переезда в другую страну :)
@it-sin9k
@it-sin9k 3 жыл бұрын
Спасибо) Новое видео уже залито на канал) завтра утром запланирована публикация) так что пока все успеваем в дедлайны))
@aksenovkirill5191
@aksenovkirill5191 2 жыл бұрын
Спасибо! Очень круто и понятно! Есть только один вопрос: зачем в компоненте с кнопкой, при передаче props ссылки на функцию - создаётся новая функция, которая связывает эти функции?
@it-sin9k
@it-sin9k 2 жыл бұрын
чтобы сделать замыкание на конкретную машину в onClick
@aksenovkirill5191
@aksenovkirill5191 2 жыл бұрын
@@it-sin9k спасибо! Очень круто!
@hihoho1578
@hihoho1578 4 жыл бұрын
👍
@artykovdaniyar
@artykovdaniyar Жыл бұрын
Что если мы используем функцию внутри useEffect или useMemo и она передаётся в качестве зависимости в массив зависимостей, даст-ли нам пользу в производительности если мы эту функцию обернем в useCallback?
@it-sin9k
@it-sin9k Жыл бұрын
набросайте лучше код) так будет понятнее)
@НикитаГончаров-е8ш
@НикитаГончаров-е8ш 2 жыл бұрын
Есть вопрос. Я не понимаю, что значит не происходит повторных рендеров? Вот функция с компонентом ведь отработает в любом случае, если в родителе изменились state?
@НикитаГончаров-е8ш
@НикитаГончаров-е8ш 2 жыл бұрын
Если я правильно понимаю, то есть смысл использовать useCallback только в 2 ситуациях, если у нас мемоизирован компонент, либо если функция в зависимостях у useEffect или типа того
@it-sin9k
@it-sin9k 2 жыл бұрын
@@НикитаГончаров-е8ш Абсолютно верно :)
@irinal7766
@irinal7766 2 жыл бұрын
Согласна, что подача материала крутая!
@unknownunknown1113
@unknownunknown1113 3 жыл бұрын
Ты очень нужен нам, приятель)
@it-sin9k
@it-sin9k 3 жыл бұрын
чего сразу пропал) неделю назад вышло последнее видео) такой контент так часто не опубликуешь)
@victorkulyabin3219
@victorkulyabin3219 3 жыл бұрын
Очень круто, спасибо!
@maksrygaev657
@maksrygaev657 3 жыл бұрын
Крутой видос спасибо коммент в поддержку канала!!
@it-sin9k
@it-sin9k 3 жыл бұрын
Продвигаем канал!))
@romanmed9035
@romanmed9035 2 жыл бұрын
все же как-то расплывчато когда использовать юзколлбэк, а когда нет. правильно ли я понял, что полезно только когда многократно используется то что мы в него завернем?
@it-sin9k
@it-sin9k 2 жыл бұрын
нет, useCallback нужен, только если вам важно, чтобы получать каждый рендер одну и ту же ссылку в памяти на функцию.А причины могут быть разные, зачем вам это нужно. Самая популярная, если вы передаете эту функцию в компонент обернутый в memo.
@romanmed9035
@romanmed9035 2 жыл бұрын
@@it-sin9k спасибо за еще более сложный и неоднозначный ответ. не каждый же раз мы компоненты оборачиваем. а вот юзколлбэки практически везде лепят.
@it-sin9k
@it-sin9k 2 жыл бұрын
@@romanmed9035 Вбил в поиск у себя в проекте useCallback, у меня их 7 на весь проект)) Почти не используем)
@romanmed9035
@romanmed9035 2 жыл бұрын
@@it-sin9k спасибо. теперь понятно что это специфический зверь и не надо всегда и везде его использовать не подумав.
@it-sin9k
@it-sin9k 2 жыл бұрын
Верно) его лучше использовать, когда ты знаешь точно, что без него будет плохо)
@ДаниярКаби
@ДаниярКаби 2 жыл бұрын
Спасибо большое, ты крут !
@it-sin9k
@it-sin9k 2 жыл бұрын
Спасибо!) Мы очень стараемся!
@krystynakoryagina356
@krystynakoryagina356 Жыл бұрын
Получается, если мы передаем функцию someFunc как пропс, а в дочернем компоненте создаем функцию Func, которая будет вызывать someFunc -> в этом случае в useCallback можно не оборачивать someFunc?
@it-sin9k
@it-sin9k Жыл бұрын
Если вы используете React.memo() то лучше использовать useCallback
@krystynakoryagina356
@krystynakoryagina356 Жыл бұрын
Спасибо ❤
@dmitriibo458
@dmitriibo458 4 жыл бұрын
Польза тут
@Infrantos
@Infrantos 3 жыл бұрын
Очень доходчиво и понятно, спасибо!
@it-sin9k
@it-sin9k 3 жыл бұрын
Очень рад!)
@lomeat
@lomeat 4 жыл бұрын
Хотелось бы еще больше таких кейсов
@it-sin9k
@it-sin9k 4 жыл бұрын
Завтра утром планируется публикация следующего видео :)
@art7653
@art7653 Жыл бұрын
Круто
@avisalon4730
@avisalon4730 3 жыл бұрын
Очень крутые уроки!
@it-sin9k
@it-sin9k 3 жыл бұрын
спасибо!)
@ilikecola378
@ilikecola378 2 жыл бұрын
Спасибо за труды! Я так понял если не указывать deps, то useCallback будет рендериться каждый раз и толка от нее не будет, т.е. указывать deps обязательно, даже если это просто [] который будет создавать callback только в момент монтирования. Поправьте если я не прав
@it-sin9k
@it-sin9k 2 жыл бұрын
Да, вы абсолютно правы)
@БакдаулетАзимбекулы-щ1щ
@БакдаулетАзимбекулы-щ1щ 2 жыл бұрын
очень круто, респект
@it-sin9k
@it-sin9k 2 жыл бұрын
Спасибо!
@МаргаритаДорохова-з4ф
@МаргаритаДорохова-з4ф 2 жыл бұрын
Скиньте, пожалуйста, ссылку, где разработчики реакт так сказали: И конечно, доверяйте реакту, если они сказали лучше создавать функцию на каждый рендер, так и делайте, ведь они заинтересованы только в улучшении перформанса вашего проекта
@it-sin9k
@it-sin9k 2 жыл бұрын
Выбора у нас особо нет. Если используешь хуки, значит создаешь функцию на каждый рендер. Вопрос тогда сводится к следующему: классы или функциональные компоненты? Ответ здесь: ru.reactjs.org/docs/hooks-faq.html#are-hooks-slow-because-of-creating-functions-in-render
@МаргаритаДорохова-з4ф
@МаргаритаДорохова-з4ф 2 жыл бұрын
@@it-sin9k спасибо за оперативный ответ) Уточню, а то я немного запуталась. Под "лучше создавать фун-ию на каждый рендер" подразумевается использование хуков? Или речь о том, чтобы не используя хуки, позволить пересоздавать функцию (которую пытаешься передать в колбэк хука)?
@it-sin9k
@it-sin9k 2 жыл бұрын
Честно говорю я уже теряю суть вопроса)) В видео я пытался показать, не пишите классовые компоненты, а пишите функциональные компоненты. Но в функциональных компонентах может показаться, излишним создание функции например const onClick = {} на каждый рендер. Так вот это не проблема, просто смириться с этим надо))
@МаргаритаДорохова-з4ф
@МаргаритаДорохова-з4ф 2 жыл бұрын
@@it-sin9k Поняла, спасибо!
@artemii9960
@artemii9960 3 жыл бұрын
Спасибо большое за крутой контент! Есть один вопрос по поводу ответа на 3:41: разве ф-я "someFunction" не будет создаваться реже в случае useCallback? К примеру если у нас компонент Test отрисовывается в родителе Parent и причиной отрисовки Parent является не смена "title", а что-то другое - то компонент Test все равно будет перерисовываться. А в случае useCallback ф-я "someFunction" будет создаваться только когда меняется "title". Это если бы у нас ф-я Test была обернута в React.memo - тогда да, отвел был бы "ни в каком". Но да, цена использования useCallback в этом случае намного дороже нежели цена создания ф-ии "someFunction". UPD: и также на 8:35 все компоненты Car будут перерисовываться если компонент Cars будет перерисовываться (потому что Car не обернут в React.memo), хоть и ф-я "onCarClick" обернута в useCallback.
@it-sin9k
@it-sin9k 3 жыл бұрын
нет, не будет. функция создается всегда. useCallback лишь может принимать решение. Вернуть вам функцию только что созданную или мемоизированную. А история про Test и useMemo это уже другая тема
@artemii9960
@artemii9960 3 жыл бұрын
@@it-sin9k А, спасибо, да, это я затупил - ф-я будет создаваться на каждый рендер, а вот ссылка на ф-ю будет меняться реже.
@MrCortc
@MrCortc 2 жыл бұрын
Конечно будет! Используйте useCallback и получайте профит!
@it-sin9k
@it-sin9k 2 жыл бұрын
@@MrCortc почему будет?
@MrCortc
@MrCortc 2 жыл бұрын
@@it-sin9k Хм, я писал подробный комментарий к этому видео, но сейчас его нет. Хочешь сказать youtube удалил? Сохрани в массив все someFunction после объявления и сравни. В обычном случае они всегда разные. В случае использования useCallback только в первый будет отличаться. Видимо реакт создает какую-то заглушку функции.
@rudinandrey
@rudinandrey 2 жыл бұрын
бросилось в глаза: даже если недавно пришли в React из другого языка программирования )))
@kostyakozlov5289
@kostyakozlov5289 2 жыл бұрын
Вопрос - Можно ли в данном случае onClick вынести за пределы компонента? Или это ошибочно с архитектурной точки зрения
@it-sin9k
@it-sin9k 2 жыл бұрын
В данной реализации не очень эффективно выносить вверх. Так во всем компоненты мы передаем одну и ту же ссылку на функцию. И благодаря этому React.memo, помогает нам предотвращать рендеры. А если вынесем на уровень map создание функции, то всегда будет новая ссылка на функцию и тогда React.memo не будет никогда работать
@dmitry9463
@dmitry9463 3 жыл бұрын
Интересно, в чем основное отличие между useMemo и useCallback?
@it-sin9k
@it-sin9k 3 жыл бұрын
Смотрите дальше) там есть целый ряд видео про исходники этих хуков
@trueman8413
@trueman8413 2 жыл бұрын
Привет! Немного не понял момент с собственным написанием useCallback. Вначале ставишь условие, что при отсутствии массива зависимостей (в prevState или переданный ) приравнять оба поля и вернуть коллбек, но точно такие же действия ставишь и в конце ф-ии, в чем заключается смысл, можно ведь просто убрать начальное условие и оставить условие с сверкой массива зависимостей?
@it-sin9k
@it-sin9k 2 жыл бұрын
Пришлось даже пересмотреть все видео, чтобы понять вопрос) На будущее бросайте тайм код, чтобы не искать)) А так ваши рассуждения абсолютно верные. По идее можно было бы просто сравнить на shallowEqual() и все тут. Почему же я поступил иначе. Я не выдумал этот код, я лишь упростил реальные исходники useCallback. Поэтому вышло немного не очевидно. Но как вы понимаете не в этом суть видео :)
@trueman8413
@trueman8413 2 жыл бұрын
@@it-sin9k да, точно, извини, что без таймкода 😄
@Programarium_academy
@Programarium_academy 3 жыл бұрын
инфа супер!
@it-sin9k
@it-sin9k 3 жыл бұрын
все для вас)
@ivanMoldovanu
@ivanMoldovanu Жыл бұрын
Хотел бы спросить: Правильно ли я понимаю - если есть дочерний компонент, ререндеры которого очень дорогостоящие, то, в таком случае, мы оборачиваем функцию, которую передаем в него, в useCallback. Вопрос вот в чем - допустим, в этот дочерний компонент мы передаем 5 функций. Если я не оберну хотя бы одну функцию в useCallback, то обернутые остальные 4 функции не имеют смысла(т к при ререндере родительского компонента, из которого мы эти функции передаем в дочерний, ререндерится эта одна единственная необернутая функция, что заставляет ререндерится дочерний компонент)? Заранее спасибо за ответ!
@it-sin9k
@it-sin9k Жыл бұрын
Да, все правильно :) либо можно в React.memo вторым параметром передать функцию сравнения props.
@ivanMoldovanu
@ivanMoldovanu Жыл бұрын
@@it-sin9k вы имеете ввиду, что во втором параметре мемо все обрабатывать как обычно, кроме конкретно этой, необернутой функции. Именно ее обработать таким образом, что если меняется ссылка на нее, то все равно не вызывать ререндер?
@it-sin9k
@it-sin9k Жыл бұрын
@@ivanMoldovanu есть такая возможность, если вам нужен рендер, только например когда 1 из 5 props иеняется, мы можем написать проверку в react.memo, чтобы только его сравнивать и в таком случае не важно, новая ссылка на функцию пришла или старая
@ivanMoldovanu
@ivanMoldovanu Жыл бұрын
@@it-sin9k спасибо!!!
@jenerly-liasinjuaru2643
@jenerly-liasinjuaru2643 10 ай бұрын
То, что useCallback не кеширует функцию компонента между рендерами того же компонента (поскольку сам он обновляется полностью) - звучит очевидно да, но в таком контексте как озарение. Но вот почему при обычной передаче пропса нескольким дочерним компонентам передаются будто разные функции, хотя по логике ссылка должна быть даже, ведь сам родительский компонент за этот период пересоздаваться не должен, не понятно… Извините, пока сильно туплю в React.
@ivanp7697
@ivanp7697 2 жыл бұрын
Я скажу коротко, но искренне: спасибо тебе огромное за твои ролики!
@ДмитрийКраевой-т9ж
@ДмитрийКраевой-т9ж 4 жыл бұрын
1:17 - 9 строка - this лишнее.
@it-sin9k
@it-sin9k 4 жыл бұрын
Да, все верно. К сожалению не заметили эту проблему перед публикацией видео :(
@ruslankarimov6490
@ruslankarimov6490 Жыл бұрын
суууууууууууупер! Спасибо!
@it-sin9k
@it-sin9k Жыл бұрын
спасиииииибо!
@Inkognit123
@Inkognit123 Жыл бұрын
useCallback не работает без React.memo
@it-sin9k
@it-sin9k Жыл бұрын
верно :)
@Inkognit123
@Inkognit123 Жыл бұрын
@@it-sin9k так а почему не сказал об этом в видео?)
@it-sin9k
@it-sin9k Жыл бұрын
@@Inkognit123 хз, пропустил просто)) уже порядка 20 комментов под видео на эту тему) но видео поправить уже не получится)
@testwebdevelopment4287
@testwebdevelopment4287 3 жыл бұрын
привет! хороший контент. как для вас удобнее отправлять чашку кофе, на патреоне или как спонсор в ютубе? Ваши видео стоят того. Возможно и я смогу вам чем-то помочь кроме спонсорства :)
@it-sin9k
@it-sin9k 3 жыл бұрын
Честно говоря мы еще сами не разобрались, что лучше подписка на патреон или спонсорство на youtube) поэтому где вам удобнее) А по поводу последнего предложения, мы рады любой помощи) Поэтому напишите на почту blue.sin9k@gmail.com, а там обсудим)
@kanstantsinhrytsuk7901
@kanstantsinhrytsuk7901 Жыл бұрын
Респект 👍
@Andrew-fq2ts
@Andrew-fq2ts 2 жыл бұрын
Хорошее видео В бета доке реакта указано, что useCallback можно представить в следующем виде: // Simplified implementation (inside React) function useCallback(fn, dependencies) { return useMemo(() => fn, dependencies); } В таком случае мы создаём целых две функции на каждый рендер вместо одной
@isaabazov3700
@isaabazov3700 Жыл бұрын
А без React.memo имеет смысл юзать useCallback??? Нет... верно?
@it-sin9k
@it-sin9k Жыл бұрын
да, не имеет смысла. Я не указал React.memo по ошибке в примере
@КонстантинТарасов-к6щ
@КонстантинТарасов-к6щ Жыл бұрын
Чем больше таких видео про "тонкости" работы хуков, тем больше понимания, какое же это говно. Ребята из команды реакта хотели упростить работу с компонентами и состоянием, но в итоге все эти правила и рекомендации работы с хуками вносят больше непонимания, вреда и сложности.
@_GyG_
@_GyG_ 2 жыл бұрын
А мне, кажется, вы не учли тот факт, что мемоизированную функцию нужно передавать именно в Оптимизированный дочерний компонент, и это значит, что в вашем случае компонент внутри должен быть обернут в React.memo, а иначе это не имеет слмысла
@it-sin9k
@it-sin9k 2 жыл бұрын
Да, все верно. Я в видео явно не показал, что оборачиваю компонент в React.memo. Но это имелось ввиду, я не помню уже честно говоря, проговаривал ли я словами это
@chikenmacnugget
@chikenmacnugget Жыл бұрын
Почему бы просто не вынести функци, которые не нужно пересоздавать за компонент
@it-sin9k
@it-sin9k Жыл бұрын
в функциях, чаще всего используются props, т.е. нужно замыкание делать
@chikenmacnugget
@chikenmacnugget Жыл бұрын
@@it-sin9k так и в чем проблема?
@it-sin9k
@it-sin9k Жыл бұрын
если вынести onClick например из самого компонента, то как потом получить доступ к props?
@chikenmacnugget
@chikenmacnugget Жыл бұрын
@@it-sin9k передать в качестве аргументов в функцию, которая вернет уже функцию для он клика. Зачем каждый рендер пересоздавать одни и теже функции и окружения, если их можно создать один раз?
@yuragrivicki5272
@yuragrivicki5272 3 жыл бұрын
React. useCallback, каждое видео вызывает восхищение, за дизлайк руки оторвать))
@ukostin123
@ukostin123 11 ай бұрын
Данный пример работать не будет! Компоненты Car будут по-прежнему перерисовываться вместе с родительским компонентом.
@it-sin9k
@it-sin9k 11 ай бұрын
Все верно) React.memo забыл в видео добавить))
@MrKu39
@MrKu39 Жыл бұрын
Вы в корне не правы и вводите в заблуждение ! Без React.memo в дочернем компоненте не имеет смысла оборачивать функцию , переданную в пропсах ,в useCallback! Так как при перерендере родителя ВСЕГДА запускается перерендер дочерних компонентов. Хоть бы написали верно на Хабре или закрепили здесь под видео.
@alexr0v
@alexr0v 3 жыл бұрын
Ну все, я запутался...
@alexandrchazov6185
@alexandrchazov6185 3 жыл бұрын
useCallback
@Алексей-т2х8й
@Алексей-т2х8й 3 жыл бұрын
+
@ЯрославКуцмида
@ЯрославКуцмида 3 жыл бұрын
кто поставил дизлайк??? школа программирование?)))
@it-sin9k
@it-sin9k 3 жыл бұрын
ахахах) хороший вопрос)
@tutnichegonet
@tutnichegonet 3 жыл бұрын
это лайк из Австралии
@КонстантинТарасов-к6щ
@КонстантинТарасов-к6щ Жыл бұрын
Какое-то странное объяснение работы useCallback. Понятно, что мемоизация не бесплатная, но при некотором большом числе зависимостей становится выгодно мемоизировать функцию. Об этом не было ни слова. Что опять может внести неправильное представление в головы разработчикам. Так сказать, другая крайность.
@it-sin9k
@it-sin9k Жыл бұрын
А какая разница сколько зависимостей у useCallback? на результат это вроде как не влияет
@КонстантинТарасов-к6щ
@КонстантинТарасов-к6щ Жыл бұрын
@@it-sin9k я про те зависимости, которые идут вторым аргументом (deps). И чем реже меняются эти зависимости, тем больше попаданий в кэш. Соответственно выгодней использовать useCallback.
Все ли вы знаете о React key?
8:47
АйТи Синяк
Рет қаралды 39 М.
coco在求救? #小丑 #天使 #shorts
00:29
好人小丑
Рет қаралды 120 МЛН
Mom Hack for Cooking Solo with a Little One! 🍳👶
00:15
5-Minute Crafts HOUSE
Рет қаралды 23 МЛН
Зачем на самом деле нужен хук useCallback
8:33
Михаил Непомнящий
Рет қаралды 45 М.
Learn React Hooks: useCallback - Simply Explained!
17:15
Cosden Solutions
Рет қаралды 110 М.
React 15: Хук useMemo и useCallback
13:38
Школа web-программирования Constcode
Рет қаралды 27 М.
Невероятный Vite под микроскопом
14:51
АйТи Синяк
Рет қаралды 35 М.
React мемоизация - useCallback, useMemo, memo
31:02
coco在求救? #小丑 #天使 #shorts
00:29
好人小丑
Рет қаралды 120 МЛН