React Fiber 实现原理草稿
Fiber 架构想解决的是 React 的虚拟 DOM 树在构建和 DIFF 阶段无法打断的问题。
具体的实现方式有:
- 双缓冲机制:保留上一次状态和处理中的 Fiber 树。难点在于中断和恢复机制。
- 两阶段提交:虚拟 DOM 树构建可打断,提交变更不可打断
- 闲时调度:每一个 Fiber 节点都是一个最小执行单元
# 草稿
中断的执行单元? 不是单元内暂停,而是已经执行完了,准备执行下一个执行单元时中断。
每个虚拟dom是一个fiber单元,构成链表
fiber 遍历,为啥采用迭代代替递归? 需从头恢复,不能随意中断
componentWillMount 这些方法为什么不能用? 如果执行了副作用,会调用多次,
setState 执行 fiber 链后,
高优任务,放弃原链。
# 两个阶段
# 简单说明
协调(diff,非连续),提交
# 总结
- 双缓冲机制:2 个 Fiber 树,其中一个为 WIP ,用于处理进行中的 DIFF,并保持和原始 Fiber 树的差异。后续提交阶段直接应用差异更新真实 DOM
- 中断和恢复:待研究。。
编辑 (opens new window)
上次更新: 2024/09/01, 23:56:56