1、为什么要引入React Fiber，为了解决什么问题
2、如何解决的
3、引入了React Fiber以后有什么变化
React Fiber解决什么问题？
因为之前的结构会造成页面卡顿。
为什么会造成页面卡顿？？
react中调用render和setState方法来进行渲染和更新。主要包含两个阶段：
- reconciler调度阶段：会进行自顶向下的递归算法，遍历数据生成新的virtual DOM。通过diff算法，找到需要更新的元素，放到更新队列中。这个策略是无法中断的，一旦开始，必须等到整课virtualTree计算完成后，才会将任务出栈释放主线程。但是浏览器的渲染引擎是单线程的，如果在这个时候主线程上有用户交互或者动画任务的话，无法立即处理，影响体验。
- 渲染阶段：根据所在的渲染环境，遍历更新队列，调用渲染宿主环境的API，将对应的元素更新渲染，
React Fiber如何解决页面卡顿问题
将调度阶段分为一系列小任务。每一次加入一个节点到任务中，做完以后看是否还有时间继续下一个任务，如果有就继续。没有就将自己挂起，在主线程不忙的时候在继续。每次只做一小段，做完一段就把时间控制权还给主线程。而不是像之前长时间占用，从而实现对任务的暂停、恢复、灵活控制。 这里的节点就是Fiber Node。
引入了Fiber后的变化-生命周期的变化
在未引入Fiber之前，我们的生命周期是这样的：
引入Fiber后，将任务分为一个个小节点，可能会在render之前被中断/恢复。导致render之前的生命周期发生被多次执行。
所以我们废弃了render之前的三个生命周期
- componentWillMount
- componentwillRecieveProps
- componentWillUpdate
取代：
var LIFECYCLE_SUGGESTIONS = {
UNSAFE_componentWillMount: 'componentDidMount',
UNSAFE_componentWillReceiveProps: 'static getDerivedStateFromProps',
UNSAFE_componentWillUpdate: 'componentDidUpdate'
};
给出的解决方案，增加了两个新的生命周期：
- getDerivedStateFromProps取代will生命周期
- getSnapshotBeforeUpdate 在render之后执行。DOM元素还没更新时，给一个机会获取DOM信息，计算得到snapshot
生命周期变为：
所有内容皆非原创，原创请看：zhuanlan.zhihu.com/p/44942360
