React 中的 Scheduler

Question

1. 时间切片

时间切片本质在模拟 requestIdleCallback

一个 task(宏任务) -- 队列中全部job(微任务) -- requestAnimationFrame -- 浏览器重排/重绘 -- requestIdleCallback

Scheduler 的时间切片功能是通过 task（宏任务）实现的。

最常见的 task 当属 setTimeout 了。但是有个 task 比 setTimeout 执行时机更靠前，那就是 MessageChannel，所以 Scheduler 将需要被执行的回调函数作为 MessageChannel 的回调执行。如果当前宿主环境不支持 MessageChannel，则使用 setTimeout。

2. 优先级调度

React 的任务具有优先级，优先级高的需要优先执行，优先级意味着任务的过期时间，如果任务已经过期，则需要立即执行