react性能优化是shouldComponentUpdate周期函数;该函数可判断是否需要调用render方法重新描绘dom,能够优化dom diff算法,语法为“shouldComponentUpdate(Props,state)”。

本教程操作环境:Windows10系统、react16.4.0版、Dell G3电脑。
react性能优化是哪个周期函数
shouldComponentUpdate 这个方法用来判断是否需要调用render方法重新描绘dom。因为dom的描绘非常消耗性能,如果我们能在shouldComponentUpdate方法中能够写出更优化的dom diff算法,可以极大的提高性能
shouldComponentUpdate() 方法格式如下:
shouldComponentUpdate(nextProps, nextState)
shouldComponentUpdate() 方法会返回一个布尔值,指定 React 是否应该继续渲染,默认值是 true, 即 state 每次发生变化组件都会重新渲染。
shouldComponentUpdate() 的返回值用于判断 React 组件的输出是否受当前 state 或 props 更改的影响,当 props 或 state 发生变化时,shouldComponentUpdate() 会在渲染执行之前被调用。
以下实例演示了 shouldComponentUpdate() 方法返回 false 时执行的操作(点击按钮无法修改):
React 实例
输出结果:

以下实例演示了 shouldComponentUpdate() 方法返回 true 时执行的操作(点击按钮可以修改):
React 实例
输出结果:

点击按钮后:

推荐学习:《react视频教程》











