Question

我在useMemo中大量使用Functional Components，但我对此感到担心，在我们的App中大量使用它会是一种很好的体验吗？

为什么我经常使用它？

我有一个Components太多，除非在特殊情况下不需要重新渲染它们，这就是为什么我避免重新渲染它们。

代码：

const App = props => {


 const Comp1 = useMemo(()=> <Component1 {...props} a={a} />, [a]);
 const Comp2 = useMemo(()=> <Component2 {...props} b={b} />, [b]);
 const Comp3 = useMemo(()=> <Component3 {...props} c={c} />, [c]);
 const Comp4 = useMemo(()=> <Component4 {...props} d={d} />, [d]);
 const Comp5 = useMemo(()=> <Component5 {...props} e={e} />, [e]);
 const Comp6 = useMemo(()=> <Component6 {...props} f={f} />, [f]);
 const Comp7 = useMemo(()=> <Component7 {...props} g={g} />, [g]);
 const Comp8 = useMemo(()=> <Component8 {...props} h={h} />, [h]);
 const Comp9 = useMemo(()=> <Component9 {...props} i={i} />, [i]);

 return (
   <View>
     {Comp1}
     {Comp2}
     {Comp3}
     {Comp4}
     {Comp5}
     {Comp6}
     {Comp7}
     {Comp8}
     {Comp9}
   </View>
 );
}

我可能有20个以上的Functional Components，并且在所有情况下，我都遇到了许多useMemo挂钩的情况。

我的问题是，这是bad experience而不是好performance而不影响好performance的问题吗？还是我的条件没有问题。

Answer 1

我假设对React.memo的一般建议与对shouldComponentUpdate和PureComponent的建议相同：进行比较的确花费很小，并且在某些情况下组件永远不会正确地记忆（特别是如果使用道具的话） .children）。因此，不要只是将所有内容自动包装到各处。了解您的应用程序在生产模式下的行为，使用React的性能分析版本和DevTools分析器查看瓶颈所在，并有策略地使用这些工具来优化组件树的某些部分，这些部分实际上将从这些优化中受益。

什么时候不使用useMemo？

1 个答案: