## :-: PureComponent - 性能优化 纯组件，用于避免不必要的渲染(运行render函数)，从而提升性能 **优化指南：** 如果一个组件的`属性`和`状态`，都没有发生变化重新渲染是没有必要的。 **生命周期：** shouldComponentUpdate(nextProps, nextState){···} ***** `PureComponent`是一个组件，如果某个组件继承自该组件，则该组件的` shouldComponentUpdate`会进行优化，对`属性(props)`和`状态(state)`进行浅比较，如果相等则不会重新渲染(false)。 ***** **用法** :-: 类组件 ``` import React, { PureComponent } from 'react'; export default class xxx extends PureComponent {···} ``` :-: 函数组件 ``` function Task(peops){···} export default React.memo(Task); // 优化后的高阶组件 ``` ***** **注意** * `PureComponent`进行的是浅比较，为了效率应该尽量使用它。 * 要求不要改动之前的状态，永远是创建新的状态覆盖之前的状态。(Immutable) * 避免使用`this.state.arr.push(xxx);this.setState({arr:this.state.arr})`， 而是采用`this.setState({arr:[ ...this.state.arr, xxx ]}) ` * 有一个第三方js库 `Immutable.js` ，它专门用于制作不可变对象。 * 函数组件可以使用`React.memo`函数制作纯组件。