React Fiber

React Fiber是对核心算法的一次重新实现

为什么要重新实现核心算法

react 15中，更新过程是同步的一层组件套一层组件，逐渐深入的过程，在更新完所有组件之前不停止，调用的很深，并且很长时间不会返回。所以如果在更新的过程中，用户向表单元素中输入内容就会发生卡顿，导致性能问题。

React Fiber把每一个耗时长的任务分成很多小片，虽然总时间很长，但是每一个小片执行完之后，都会给其他任务一个执行的机会，这样唯一的线程就不会被独占，其他任务依然有运行的机会，维护每一个分片的数据结构，就是Fiber。

React Fiber对现有代码的影响

在React Fiber中，一次更新会被分成多个分片完成，所以很有可能一个更新任务还没有完成，就被另一个优先级更高的更新过程打断，这个时候，优先级高的更新任务会优先处理完，而低优先级更新任务所做的工作就会完全作废，然后等待机会重头再来。

因为一个更新工程可能会被打断，所以React Fiber一个更新过程被分为两个阶段：

1. Reconciliation Phase：找出需要更新哪些DOM，这个阶段可以被打断
2. Commit Phase：一鼓作气把DOM更新完，绝不会被打断

以render函数为界，第一阶段可能会调用下面这些生命周期函数，说是“可能会调用”是因为不同生命周期调用的函数不同。

componentWillMount
componentWillReceiveProps
shouldComponentUpdate
componentWillUpdate

下面这些生命周期函数则会在第二阶段调用
componentDidMount
componentDidUpdate
componentWillUnmount

因为第一阶段的过程会被打断而且“重头再来”，所以第一阶段中的生命周期函数在一次加载和更新过程中可能会被多次调用。所以在使用React Fiber之后，一定要检查一下第一阶段相关的这些生命周期函数，看看有没有逻辑是假设在一个更新过程中只调用一次，有的话就需要更改了。