与传递属性相比，useContext / useSelector是否会影响性能？

Question

我有一个包含多个嵌套子组件的组件；这些子级需要有关父级组件的信息以及我的redux存储中的数据。给定它们的数量，在每个父子组件中使用useSelector挂钩一次并通过属性（而不是上下文）传递它，是否比每个孩子都使用useSelector更好？另外，通过每个父组件的属性传递有关父组件的信息是否比让每个子组件都使用useContext更好？

edit：在测试中，通过属性时速度提高了20％；我的猜测是useSelector / useContext在声明中比在属性上花费更多？谁能确认这是真的？

Answer 1

使用一次useSelector挂钩是否更好，是明智的选择？ 父组件并将其向下传递给属性（而不是 上下文），而不是让每个孩子都使用useSelector？

第二个是更好的选择。与第一选择相比，您的不必要的重新渲染将更少。

在您的首选方案中，更改父级中的某些内容时，它将触发组件的重新渲染（意味着子级将受到影响）。

最好通过传递有关父组件的信息 它的属性，而不是让每个孩子都使用useContext？

答案与上面相同。

Answer 2

您可以看到react-redux使用上下文API https://github.com/reduxjs/react-redux/search?q=useContext&unscoped_q=useContext

就性能而言，以上所有方法都非常接近。

解决性能问题的最佳方法如下：

1. 写出高质量的代码（每个函数的args数量，每个模块的行数，圈复杂度，块嵌套，扇入/扇出系数等等）。不要考虑性能问题。
2. 分析并找出质量优良代码中的瓶颈。优先考虑它们。
3. 修复发现的问题https://en.reactjs.org/docs/optimizing-performance.html