react diff 算法将不会尝试匹配不同组件类的子树。如果发现正在使用的两个组件类输出的 DOM 结构非常相似，你可以把这两个组件类改成一个组件类
如果没有提供稳定的 key（例如通过
Math.random()生成），所有子树将会在每次数据更新中重新渲染。引入 immutable 和 pureRender 后，render 里的 JSX 注意一定不要有同样的 key（如两个列表，有重复的数据，此时以数据 id 来作为 key 就不太合适，应该要用数据 id + 列表类型作为 key ），会造成不渲染新数据情况。列表页目前的处理办法是将 key 值换成 id + listType。
使用 shouldComponentUpdate 对于变化的 props 以及 state 判断，是否需要重新 render 。
对于组件接收数据尽量扁平化，便于优化 diff 比较。
将方法的 bind 一律置于 constructor ，每次 render 都 bind ，会消耗性能。
慎用 setState，因其容易导致重新渲染，shouldComponentUpdate 也需要比较 state 。
只传递 component 需要的 props。
组件拆分更细，便于 diff 以及重新 render 成本更小。
对于 shouldComponentUpdate ：（结果影响是否需要 diff ）加速 shouldComponentUpdate 的检查，简化 shouldComponentUpdate 的检查，React 官方提供了[Performance Tools]，对渲染性能监控
import Perf from 'react-addons-perf';
Perf.start();
....your react code;
Perf.stop();
调用Perf.printWasted();查看组件上进行了无意义的(没有引起真实 DOM 的改变)虚拟 DOM 比较。
Perf.printInclusive()的结果则给出渲染各个组件的总体时间
纯 React 优化 1.0 （未完）
最后编辑于 ：
©著作权归作者所有,转载或内容合作请联系作者
- 文/潘晓璐 我一进店门，熙熙楼的掌柜王于贵愁眉苦脸地迎上来，“玉大人，你说我怎么就摊上这事。” “怎么了？”我有些...
- 文/花漫 我一把揭开白布。 她就那样静静地躺着，像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上，一...
- 文/苍兰香墨 我猛地睁开眼，长吁一口气：“原来是场噩梦啊……” “哼！你这毒妇竟也来了？” 一声冷哼从身侧响起，我...
推荐阅读更多精彩内容
- 原教程内容详见精益 React 学习指南，这只是我在学习过程中的一些阅读笔记，个人觉得该教程讲解深入浅出，比目前大...
