我偶然发现了保罗·爱尔兰(Paul Irish)发布的article - requestAnimationFrame Scheduling For Nerds

我通读它,然后提出一个问题,我们有什么办法可以安排在每帧rAF之前运行的任务?

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

最佳答案

首先,Chrome和Firefox在配置和绘制保罗在他的文章中解释的绘画之前先运行rAF。 Safari and IE 具有不同的行为,Edge is fixing

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

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

我们可以在rAF本身内部完成所有关键帧JS执行。没有必要将JS执行分为两部分(“我的任务+ rAF”),因为在Layout和Paint之前,您没有超过~10ms to execute rAF(JS代码),并且如果我们超过该fps下降,我们将看到讨厌的声音;

TL:DR;在那个关键时刻,除了rAF回调之外,没有其他方法可以执行js了:)

07-24 09:48
查看更多