问题描述
TL; DR
有些博客说，每次将回调传递给子组件时，您都不需要使用useCallback钩子，有时最好每次创建一个新函数。因为useCallback的费用有时会高于实际性能问题。尽管React警告说这可能会导致性能问题，但我们需要尝试避免这种情况。
谁是正确的，在这两个对立的主张之间取得平衡的方式是什么？
完整问题
最近，我一直在阅读许多有关react挂钩的博客和教程，尤其是有关useCallback和useMemo的博客。
在我使用类组件时，在React 16（及其所有钩子）之前，我一直使用“构造器绑定”进行回调，因为箭头函数或“绑定到渲染”如下：
render() {
return <button onClick={this.handleClick.bind(this)}>Click Me</button>;
}
render() {
return <button onClick={() => this.handleClick()}>Click Me</button>;
}
被认为是“不良做法”。来自React Docs：
每次渲染组件时，在render中使用Function.prototype.bind都会创建一个新函数，这可能会对性能产生影响（请参见下文）。
所以，我的经验法则是不要将新功能传递给道具。
在React 16中，useCallback钩子试图帮助我们准确地做到这一点。但是我看到很多that或that之类的博客都声称您不必每次都使用useCallback钩子，因为useCallback的费用有时会比实际问题，使用箭头函数在每个渲染器上创建新函数都很好。
两个相反的主张都使我认为最好的选择应该是这样的（如果依赖项数组为空）：
function handleCallback() { ... } // Or arrow function...
function Foo(props) {
return <button onClick={handleCallback}>Click Me</button>
}
因为这种方式不会使用“昂贵的” useCallback，并且不会每次都生成新的函数。但是，实际上，当您有多个回调时，此代码看起来不太好。
那么，这两个相反的主张之间的正确平衡是什么？如果有时每次创建一个新函数都比使用useCallback更好，那么为什么React在其文档中有关于它的警告？
（关于“双花括号”经验法则和useMemo / useRef钩的相同问题）
解决方法
暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！
如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。
小编邮箱:dio#foxmail.com (将#修改为@）