React性能优化之
React的优化是基于shouldComponentUpdate的，该生命周期默认返回true，所以一旦prop或state有任何变化，都会引起重新render。
shouldComponentUpdate
{...this.props}?(不要滥用，请只传递component需要的props，传得太多，或者层次传得太深，都会加重shouldComponentUpdate里面的数据比较负担，因此，请慎用spread attributes（<Component {...props} />）)。this.handleChange()。(请将方法的bind一律置于constructor)this.handleChange.bind(this,id)- 复杂的页面不要在一个组件里面写完。
- 请尽量使用
const element。 - map里面添加key，并且key不要使用index（可变的）。具体可参考使用Perf工具研究React Key对渲染的影响
- 尽量少用
setTimeOut或不可控的refs、DOM操作。 props和state的数据尽可能简单明了，扁平化。- 使用
return null而不是CSS的display:none来控制节点的显示隐藏。保证同一时间页面的DOM节点尽可能的少。
immutable.js
PureComponent
当前页面是本站的「Google AMP」版。查看和发表评论请点击：完整版 »
因本文不是用Markdown格式的编辑器书写的，转换的页面可能不符合AMP标准。