Как избежать использования чрезмерного использования useMemo?

Question

[Durin Qurkingo]

В документации указано следующее:

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

Звучит хорошо, не правда ли? Но чтобы оптимизировать производительность, нужно быть уверенным, что расчеты стоят дороже, чем использование самого Memo перед его использованием. Есть ли предложения, когда следует избегать использования Memo?

Answer 1

[Антон Спирин]

useMemo использует поверхностное сравнение зависимостей, так же, каждый render определяется функция колбек, если она прописана в теле компонента.

Та же фильтрация данных или рендер списков, обычно стоят дороже. Вы можете посмотреть исходный код хуков и оценить все внутренние вызовы, которые делает библиотека.

Следует помнить, что в документации есть примечание, что React может забыть ваше значение, поэтому использовать этот хук следует только для меморизации.

Видел примеры кода, когда useMemo использовали и для создания контекста и для обновления состояния. Так делать не следует, так как может произойти потеря созданного таким способом контекста или сброс состояния.

Answer 2

[Robur]

Есть ли предложения, когда следует избегать использования Memo?

накладные расходы на useMemo - сравнение двух массивов + вызов функции.

Если то что вы положили в useMemo сложнее этой операции - оно уже даст какой-то выигрыш.
Думаю сделать такую оценку каких-то трудов не составит.