当函数用作私有方法时，我是否从 useCallback 中获得任何性能提升？

编程问答 2022-05-13

问题描述

React 的 useCallback 钩子在将生成的（记忆化的）函数传递给子组件以避免不必要的重新渲染时提供了性能提升。

当钩子用作内部（“私有”）函数时，我是否会获得任何性能提升？ 例如：

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 记住的是函数引用，而不是函数本身，所以在不将其作为 prop 传递时是否必须使用它？

解决方法

对于本地使用（组件内部）=LEN(FORMULATEXT(A5))-LEN(SUBSTITUTE(FORMULATEXT(A5)," ",""))+1 字面上的doesn't make 任何改进。它会在每次重新渲染时被调用，即使考虑到它会从内存中获取一个原始函数对象，它仍然会重新创建内联函数。

但是，如果 useCallback 缓存从一些繁重的计算中接收到的值，则它是有意义的。它使用了记忆原理，这有助于避免冗余的繁重操作。

附言

值得注意的是，使用 useMemo 包装私有方法的唯一合理用例是如果（出于任何原因）您打算将此方法放入 useEffect 依赖项中。

memoizationreactjsreactjsreactjsreactjsusecallback