Блог

Главная - Вопросы по программированию - Получаю ли я какой-либо прирост производительности от обратного вызова, когда функция используется в качестве частного метода?

Получаю ли я какой-либо прирост производительности от обратного вызова, когда функция используется в качестве частного метода?

#reactjs #memoization #usecallback

Вопрос:

useCallback Крюк React обеспечивает повышение производительности при передаче сгенерированной (сохраненной в памяти) функции дочернему компоненту, чтобы избежать ненужной повторной визуализации.

Получаю ли я какой-либо прирост производительности, когда крючок используется в качестве внутренней («частной») функции? Например:

 function Foo({numbers}) {

  const dep1 = React.useMemo(() => {......}, [....])
  const calc = React.useCallback((a) => a * dep1, [dep1])

  return (
    <>
      {numbers.map((num) => (
        <div key={num}>
          Num: {num}, Calculated: {calc(num)}
        </div>
      ))}
    </>
  );
}

или делает простой

 const calc = (a) => a * dep1

то же самое и в этом случае?

Другими словами, поскольку useCallback запоминание ссылки на функцию, а не самой функции, должен ли я использовать ее, когда не передаю ее в качестве опоры?

Ответ №1:

Для локального использования (внутри компонента) useCallback буквально не вносит никаких улучшений. Он будет вызываться при каждом повторном рендеринге, и даже с учетом того факта, что он будет извлекать исходный объект функции из памяти, он все равно воссоздаст встроенную функцию.

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

P.S.

Стоит отметить, что единственный оправданный вариант использования закрытого метода useCallback -это если (по какой-либо причине) вы собираетесь поместить этот метод в зависимости useEffect.

Метки: ,