Всем привет. Второй день плотно пытаюсь понять смысл useCallback и

Question

Всем привет. Второй день плотно пытаюсь понять смысл useCallback и

не понимаю. useMemo - понимаю, useCallback - нет. Закешировать значение функции для последующей быстрой выдачи, если аргументы не изменялись - понятно, а закешировать функцию-коллбек... извиняюсь, зачем? Во всякой доке пишут, чтобы ссылка на функцию не менялась, если не изменялось ничего из массива, что во втором аргументе. А зачем надо, чтобы ссылка на функцию не менялась, чтобы что? А если она изменится, что плохого произойдет?

На скриншоте код, скопированный мною из одного примера. Там два инпута, в первом из них значение переменной событием onChange устанавливается через useCallback, во втором - напрямую. Никакой разницы в работе двух этих инпутов нет от слова "вообще". Введенное значение одинаково бодренько отображается в <p> и в том, и в другом случае.
Если кому не лень пофилософствовать, помогите понять, плиз!

#frontend #javascript #programming #react.js #russian

0

16.11.2020

17 ответов

14 просмотров

Nikolay Tolochnyy

"А зачем надо, чтобы ссылка на функцию не менялась, чтобы что? А если она изменится, что плохого произойдет?" надо, чтобы не создавать каждый раз новую функцию. Ты же обычно выносишь функции из какого-нибудь метода, а не хранишь их там, чтобы при вызове функции не создавалась новая функция?

0

16.11.2020

Vladimir Samoilenko Автор вопроса

Vetro
Чтобы не ререндерился какой-нибудь memo компонент,...

В смысле, если я пульну значение напрямую, то ререндериться будет все?

0

16.11.2020

Vladimir Samoilenko Автор вопроса

Nikolay Tolochnyy
"А зачем надо, чтобы ссылка на функцию не менялась...

Ты про то, что при каждом новом рендере обработчики событий будут новыми функциями?

0

16.11.2020

Vetro

Vladimir Samoilenko
В смысле, если я пульну значение напрямую, то рере...

Если инлайн коллбэк генерится внутри рендера, и передается пропом в мемо компонент - ссылка будет изменяться каждый раз и мемо будет бесполезен (если не передана кастомная функция сравнения пропсов)

0

16.11.2020

Nikolay Tolochnyy

Vladimir Samoilenko
Ты про то, что при каждом новом рендере обработчик...

по идеи да, новые ссылки будут

0

16.11.2020

Vladimir Samoilenko Автор вопроса

Nikolay Tolochnyy
по идеи да, новые ссылки будут

ну как бы и ладно, что плохого? Мусор в памяти?

0

16.11.2020

Nikolay Tolochnyy

Vladimir Samoilenko
ну как бы и ладно, что плохого? Мусор в памяти?

ну если брать сообщение выше, то будет каждый раз ререндер потому что каждый раз будет создание нового обработчика и другая ссылка

0

16.11.2020

Vladimir Samoilenko Автор вопроса

Nikolay Tolochnyy
ну если брать сообщение выше, то будет каждый раз ...

то есть, получается, что все обработчики ченджей, кликов и прочей хрени лучше оборачивать юзколлбеком?

0

16.11.2020

Danila

Vladimir Samoilenko
то есть, получается, что все обработчики ченджей, ...

Да, это первая мысль, которая возникает, но на это обычно следующие ответы - 1) не стоит заниматься преждевременной оптимизацией 2) Реально это стоит делать, когда ты точно знаешь, что нижелещащий компонент мемоизирован, например

0

16.11.2020

Vladimir Samoilenko Автор вопроса

Danila
Да, это первая мысль, которая возникает, но на это...

а как можно мемоизировать целый компонент?

0

16.11.2020

Danila

Vladimir Samoilenko
а как можно мемоизировать целый компонент?

React.memo(component)

0

16.11.2020