react-生命周期函数+优化

1. Initialization:

    constructor:也可以算react的一个生命周期函数，组件创建时就会执行。初始化数据的过程。

2. Mounting:

    componentWillMount: 组件即将被挂载到页面的时刻执行。 只执行一次，第一次。

    render: 页面的挂载。

    componentDidMount: 组件会在被挂载到页面之后再执行。只执行一次，第一次。

3. Updation:

3.1: props:

1. componentWillReciveProps: 如果组件没有props参数是不会被执行的；一个组件从父组件接受参数，当父组件的render再次被执行后才会执行componentWillReciveProps。或者，如果这个组件第一次存在于父组件中，是不会执行的；如果之前已经存在了，才会执行。

2. shouldComonentUpdate: 组件是否需要更新？组件更新之前会自动被执行，有两个参数，(nextProps,nextState),return true,会继续执行，return false,会阻止后面的执行，

3. componentWillUpdate:  组件更新之前被执行，但是是再shouldComonentUpdate之后被执行。

4.render: 

5. componentDidUpdate：组件更新完成之后会被执行。

3.2: state:

1. shouldComonentUpdate: 2. componentWillUpdate: 3. render: 4. componentDidUpdate:

4. Unmounting:

componentWillUnmount: 把组件从页面去除的时候执行。

react性能：

1. bind写到constructor中，再初始化的时候指定作用域this,只会执行一次，还会避免子组件的一些无畏的渲染。 

2. shouldComonentUpdate 可以避免无畏组件render函数的运行。

3. 可以使用PureComponent 替换Component ，就不需要每个组件都通过shouldComonentUpdate过滤了。

4. 使用immutable的时候，需要配合redux-immutable一起使用，可以更改顶层state数据为immutable类型。

5. 使用异步组件：react-loadable

 

动画：react-transition-group => github