graph TD
执行JS --> 计算Style
--> 构建布局模型
--> 绘制图层样式 --> 组合计算渲染 --> 呈现结果
这整个流程称之为一帧。每个帧的渲染过程是在一个UI线程中处理的。帧的渲染与帧的更新是异步的，因为屏幕有一个固定的刷新频率，一般是60赫兹，刚看了一下我在用的macbook pro屏幕是50赫兹和60赫兹可选，默认我们选择的是60赫兹，代表每秒屏幕可以刷新的画面数量为60。1000毫秒除以60，也就是说，如果是高频次交互的需求，渲染一帧的时间要低于16.6毫秒，否则可能会出现丢帧或者卡顿的情况。
其中第一步，执行JS，包括 run task，然后是 update rendering，然后可能会有计算的空隙idle callback。 然后是下一次的 run task 和 update rendering。现代浏览器都是使用requestIdleCallback来做闲时的回调的，所以react16.8中的Fiber架构也正是利用了此API进行了更新。而再次之前react团队一直没有使用requestIdleCallback的原因是，浏览器的兼容性不够。
