React的无状态组件和纯组件

react的无状态组件和纯组件

一：无状态组件（函数式组件）
       无状态组件可以通过减少继承Component而来的生命周期函数而达到性能优化的效果。
从本质上来说，无状态组件就是一个单纯的render函数，所以无状态组件的缺点也是显而易见的。
缺点：
因为它没有shouldComponentUpdate生命周期函数，所以每次state更新，它都会重新绘制render函数。
原则上，只要一个组件只具有render函数时，都可以封装成无状态组件，但是我认为其较佳的使用场景应该是使用在ListView组件的renderRow函数内部，因为每次对ListView组件的数据进行操作，都会不可避免的调用renderRow函数，而这时无状态组件无生命周期的特性恰好能有效的显示出来。虽然此时是否将renderRow里面的组件拆分出来在效果上都是一样的，但是组件的拆分有利于降低耦合，也有利于隔离这些单元进行独立测试。
二：PureComponent --纯组件
       纯组件是通过控制shouldComponentUpdate生命周期函数，减少render调用次数来减少性能损耗的。这相对于Component来说，减少了手动判断state变化的繁琐操作。
但该组件也具有一定的缺陷：
因为它只能进行一层浅比较，简单来说，它只比较props和state的内存地址，如果内存地址相同，则shouldComponentUpdate生命周期就返回false。PureComponent的使用场景应该是局部数据发生改变的场景，比如带有输入框、switch开关等的UI组件就可以使用PureComponent组件封装。PureComponent中如果有数据操作最好配合一个第三方组件——Immutable一起使用（Immutable插件可以在笔者的 react查用插件文章 查看如何下载使用 ），Immutable需要使用npm安装该插件才可以使用，因为Immutable可以保证数据的不变性。
个人理解：

1. 所谓无状态组件就是没有生命周期的组件（箭头函数return形式）；
2. 纯组件就是有生命周期的但是只是接受props来作为纯展示组件不做逻辑判断处理的组件（一般常见list组件）