React核心回顾 - 折口木木

[ZhelinCheng]

https://zhelin.me/92c2857df42fa342/

React Fiber理念

1. 为什么ES语法中有Generator可以实现异步、中断、恢复的功能，React团队还要重新设计呢？

Fiber Principles: Contributing To Fiber #7942

• 类似async，Generator也是传染性的，使用了Generator则上下文的其他函数也需要作出改变。这样心智负担比较重;
• Generator执行的中间状态是上下文关联的;

同时，Generator虽然可以实现异步、中断、恢复，但无法调度更新的优先级。

2. Fiber架构的实现原理？

React Fiber Architecture

2.1 Fiber含义

2.1.1 架构

react15（Stack Reconciler）：Reconciler采用递归的方式执行，数据保存在递归的调用栈中。

react16（Fiber Reconciler）：基于Fiber节点实现的。

2.1.2 作为静态数据结构（虚拟DOM）

每个Fiber节点对应一个React