1.react性能消耗主要在diff算法过程,所以性能优化主要在于减少不必要的diff算法
1.1减少非批更新阶段(setTimeout,setInterval,promise回调)中setState的调用次数,如在回调的最后统一执行setState
补充: 非批更新阶段:setTimeout,setInterval,promise回调,原生dom通过addEventListener绑定的事件
在react生命周期,其他react自定义事件如onclick绑定事件中setstate是“异步”执行的。
1.2通过componentShouldUpdate减少不必要的更新(每次state或props更新都会触发组件render,而每次父组件render会触发其所有的子组件render)
1.3列表循环时设置唯一key值(最好不要用index)
2.懒加载
通过懒加载在第一次进入页面时减少不必要的模块加载,提高首次加载速度
2.1通过import()
2.2react.lazy()