每日一博 | react 原理之 lane 优先级和 diff 更新
React 16中处理优先级的模型是expirationTime,它使用一个时间长度来描述任务的优先级。而React 17则使用Lane模型来处理任务的优先级,它通过将不同优先级赋值给一个位,通过31位的位运算来操作优先级,能够覆盖更多的边界条件。简言之:使用二进制数来表示任务的优先级。 为了理解的完整性,本文从 React 架构上 schedule, diff 和 commit 三个阶段的流程进行展开 1. Schedule 1.1 创建更新任务 在首次渲染和用户触发事件时会创建一个更新任务,并分配一个优先级,接着放入 fiber.updateQueue 更新对列中,交给 Scheduler 调度更新 fiber.updateQueue 是一个环形结构pending 指针指向最后一个 update,新的 update 插入过程: const pending = sharedQueue.pending if (pending === null) { // 第一个 update 进入队列,创建一个环形结构 update.next = update } else { // 最新的updat...
