## :-: 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`函數制作純組件。