聊聊 React 的更新机制原理
结论:React 更新是“三段式”:调度阶段分配优先级与合并更新,render 阶段构建 workInProgress 并 Diff,commit 阶段一次性更新 DOM 与执行 Effect。
1. 核心流程(建议按这条线回答)
- schedule:update 入队 + lane 分配 + root 调度
- render:workLoop 遍历 Fiber,reconcile 生成新树并打 flags
- commit:根据 flags 执行 DOM 变更与 effect(layout/passive)
2. 并发下的区别
- render 可中断/可重做;commit 仍然原子
- 高优先级更新可插队,低优先级可能延后或重做
3. 面试加分点
- 提到 batching:React 18 自动批处理减少重复渲染
- 提到 lanes:用位图表达优先级与更新集合