打造高性能的react
根本目的就是减少重复渲染
使用使用 shouldComponentUpdate 规避冗余的更新逻辑
shouldComponentUpdate触发的条件是只要父组件更新了,就会被触发,在里面判断传入的pros是否改变,
不变则返回false
PureComponent + Immutable.js
PureComponent其实就是内置了对shouldComponentUpdate的实现,不过其对props的比对是浅比较,
基本数据类型会判断其是否相等,引用数据类型会判断其对象地址是否变化,带来的问题就是,引用数据类型
内置的数据变化了,但是却没有更新或者是引用类型数据不变但是其地址变化了,触发不必要的更新。
为了解决这类问题,引入了Immutablejs,持久性数据的库,只要这个数据被创造出来,就不能被更改,更改的话就会返回一个新对象
React.memo 与 useMemo
memo是函数版的shouldComponentUpdate,第二个参数就是shouldComponentUpdate,在里面对比props,
不传入的时候就是类似PureComponent,进行浅比较
useMemo其实就是更细致话的memo,React.memo 控制是否需要重渲染一个组件,而 useMemo 控制的则是是否需要重复执行某一段逻辑