如何解决当函数用作私有方法时,我是否从 useCallback 中获得任何性能提升?
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 依赖项中。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。