react性能优化点

react性能优化点

1.虽然 props 由React本身设置以及 state 用于存储状态，但如果需要存储不用于视觉输出的东西，则建议通过手动向类或实例中添加相应属性来存储，而不应用 state 和 props 来存储；

2.如果在组件的钩子方法shouldComponentUpdate中返回false，则React不会对该组件及其子组件进行变化检查和渲染，所以，应在组件不需要更新的情况下，让钩子方法shouldComponentUpdate内返回false；

3.因为 React.PureComponent类型的组件在做变化检查时是用浅比较来判断是否有变化的，所以性能较快，所以：对于没有必须进行深比较的组件，优先使用 React.PureComponent 而不是 React.Componen；

4.合理的使用key；

5，在开发组件时，保持稳定的 DOM 结构会有助于性能的提升。例如，可以通过 CSS 隐藏或显示节点，而不是真的移除或添加 DOM 节点。

转载于:https://juejin.im/post/5c0e67a3e51d450d583050a7