小于 1 分钟
React 状态更新
流程概览
类比分支管理的心智模型
在React中，通过ReactDOM.createBlockingRoot和ReactDOM.createRoot创建的应用会采用并发的方式更新状态。
高优更新（红色节点）中断正在进行中的低优更新（蓝色节点），先完成render - commit流程。
待高优更新完成后，低优更新基于高优更新的结果重新更新。
Update 对象
Update与Fiber的联系
Fiber节点组成Fiber树，页面中最多同时存在两棵Fiber树：
- 代表当前页面状态的
current Fiber树 - 代表正在
render阶段的workInProgress Fiber树
类似Fiber节点组成Fiber树，Fiber节点上的多个Update会组成链表并被包含在fiber.updateQueue中。
什么情况下一个Fiber节点会存在多个Update？
方法内部多次调用this.setState
Fiber节点最多同时存在两个updateQueue：
current fiber保存的updateQueue即current updateQueueworkInProgress fiber保存的updateQueue即workInProgress updateQueue
在commit阶段完成页面渲染后，workInProgress Fiber树变为current Fiber树，workInProgress Fiber树内Fiber节点的updateQueue就变成current updateQueue。