Fiber 与调度直觉
面试不要求背源码,但要能说清:为什么需要 Fiber、和 Stack Reconciler 差在哪、调度在解决什么问题。
旧模型的问题:递归一气呵成
早期协调可以粗理解为:从根递归对比整棵树,一旦开始就不能停。
主线程还要处理:输入、动画、响应点击。若协调太久 → 掉帧、输入卡顿。
Fiber:把工作拆成可中断的单元
Fiber 既是 数据结构(每个组件对应一个 Fiber 节点,串成树/链表),也是 工作模型:
- 更新被拆成一个个小工作单元
- 做一会儿可以 暂停,把主线程还给浏览器
- 有空再 继续;更高优任务来了可以 插队 / 丢弃过期工作
可以记成:
Stack Reconciler ≈ 递归,难中断
Fiber Reconciler ≈ 链表上的循环,可停下、可恢复
两阶段心智(够面试用)
- Render / Reconciliation(可中断)
算「下次 UI 应该长什么样」(跑组件函数、diff),尽量不碰真实 DOM。 - Commit(同步、不可随便打断)
把变更刷到 DOM,跑 layout effect 等。要短,否则用户会看到中间态或卡顿。
所以:重计算尽量想办法不堵在 commit;紧急 UI(输入回显)应优先于重列表过滤。