Notes

workLoop 循环完整逻辑

一句话结论:workLoop 做的事是“把一次更新渲染成一棵新 Fiber 树”,并在并发模式下按时间片随时暂停;完成后再进入一次性 commit。

1. 核心循环(高度抽象)

  • 选出 nextLanes(本轮要处理的优先级集合)
  • renderRoot(sync 或 concurrent)
  • 并发模式:循环执行工作单元,期间反复检查 shouldYield()

2. 单元工作包含什么

  • beginWork:根据更新计算子 Fiber(reconcile),产生下一层工作
  • completeWork:收集副作用(flags)、构建离屏 DOM(视实现阶段而定)

3. 结束条件

  • 所有 workInProgress 完成 → 得到 finishedWork(待提交的 Fiber 树)
  • 进入 commitRoot:把变更一次性应用到 DOM,并触发生命周期/Effect

关联阅读

cd ..