javascript - 在每帧中的 rAF 之前运行任务的可靠方法

Question

我偶然发现了一个article - requestAnimationFrame Scheduling For Nerds由保罗·爱尔兰发布。

我通读了一遍，然后提出了一个问题:有什么方法可以安排一个任务在每帧中的 rAF 之前运行(参见附图)？

Answer 1

首先，Chrome 和 Firefox 在布局和绘制之前运行 rAF，paul 在他的文章中对此进行了解释。 Safari and IE 有不同的行为，Edge is fixing ；

现在让我们回到你的问题；考虑有办法在每一帧的 rAF 回调之前运行一点 JS(我的任务)。假设“我的任务”执行需要大约 4 毫秒，而您的 rAF 回调需要大约 5 毫秒才能在每一帧中完成。这总共需要大约 9 毫秒的 JS 执行时间。那么这里有什么意义呢？我们可以在大约 9 毫秒内运行 rAF 回调中的所有内容，换句话说，这相当于延长了 rAF 执行的长度:

帧前总 JS 执行 = 我的任务代码执行 + 常规 rAF 代码执行

我们可以在 rAF 本身内部执行所有 Frame Critical JS 执行；将 JS 执行分成两部分( My Task + rAF )是没有意义的，因为在 Layout 和 Paint 之前你没有超过 ~10ms to execute rAF (JS 代码)，如果我们超过了 fps 下降，我们就会看到卡顿；

TL:博士；关键时刻除了rAF回调没有办法执行js:)