React Fiber - Schedule (占坑)

[Hazlank]

Schedule

在React Fiber的结构下，可以拆分成小的任务分片执行，怎么去分配资源已执行任务就是调度做的事情

In computer, scheduling is the action of assigning resources to perform tasks. The resources may be processors, network links or expansion cards. The tasks may be threads, processes or data flows.The scheduling activity is carried out by a process called scheduler. Schedulers are often designed so as to keep all computer resources busy (as in load balancing), allow multiple users to share system resources effectively, or to achieve a target quality-of-service.Scheduling is fundamental to computation itself, and an intrinsic part of the execution model of a computer system; the concept of scheduling makes it possible to have computer multitasking with a single central processing unit (CPU).

上面是wiki对于Schedule的说明。重点在于调度的概念使具有单个中央处理单元 (CPU) 的计算机多任务处理成为可能。

在以前的只有单处理器的计算机中，操作系统对于一个正在运行的程序抽象成了进程，并且能够在系统同时运行多个进程，传统系统在一个时刻内只能执行一个程序，除了多核处理器。所以一个cpu看上去是在并发执行多个进程任务，其实只是通过cpu在进程间快速回切换实现的，就像是杂技演员保持多个球都能在空中飞舞一段时间

所以对于单线程的js来说并不能同时执行多个任务，只能通过代码模拟进程，通过调度模拟并发

在之前的Fiber讲解中，已经说明了怎么模拟类似进程的概念。接下来就得知道React要给每个进程分配多少时间做一件事，怎么分配,这个就是调度该做的事情

时间分片

• 基于Fiber的同步更新

• 基于Fiber的异步更新

能看到异步的更新是分成一小段相同的时间执行,这个时间段在16ms内，为什么是16ms。

玩游戏的时候我们知道FPS(Frames Per Second)越高越流畅，也就是每秒传输帧数。在游戏过程中一般人能接受的最低FPS约为30，基本流畅等级则需要>60。所以为了保证流畅性，浏览器图像（页面）刷新频率也是在60。一秒分下来每帧的运行时间就在16ms (1000ms / 60)。像我们打游戏一样，一到打团，fps就下降了，因为需要进行大量的计算进行图形渲染。浏览器也一样，如果时间都耗费在运行js上，渲染也不会流畅

浏览器一帧会做什么呢？我们知道浏览器是单线程的，所有的东西都在一起处理，像一个全栈工程师一样包揽所有的活，比如各种的事件，(scroll,resize,mouse,keydown...)，计时器，js执行，还要重新计算样式(recalculate style),update layer tree，最后进行绘制(paint)，再依照顺序进行渲染层合并(composite layers)，形成最终的页面

浏览器渲染一帧的生命周期