注意:此测试占用大量cpu。requestAnimationFrame
IE 9-和Opera 12-不支持。
该测试记录setInterval
并requestAnimationFrame
在不同的浏览器中运行所需的实际时间,并以分发的形式为您提供结果。您可以更改毫秒数,setInterval
以查看其在不同设置下的运行方式。延迟方面的setTimeout
工作与a类似setInterval
。requestAnimationFrame
通常默认设置为60fps,具体取决于浏览器。要查看切换到其他选项卡或不活动窗口时发生的情况,只需打开页面,切换到其他选项卡,然后等待一段时间。它将继续在不活动的选项卡中记录这些功能的实际时间。
测试它的另一种方法是使用setInterval
和反复记录时间戳,并requestAnimationFrame
在独立的控制台中查看它。当您使选项卡或窗口处于非活动状态时,您可以查看更新的频率(或者是否曾经更新)。
器将最小间隔限制为setInterval
1000毫秒左右。如果间隔大于1000ms,它将以指定的间隔运行。窗口是否聚焦不重要,仅当您切换到其他选项卡时,间隔才会受到限制。requestAnimationFrame
选项卡处于非活动状态时暂停。
// Provides control over the minimum timer interval for background tabs.
const double kBackgroundTabTimerInterval = 1.0;
与Chrome相似,setInterval
当选项卡(而非窗口)处于非活动状态时,Firefox将最小间隔限制为1000毫秒左右。但是,requestAnimationFrame
当选项卡处于非活动状态时,运行速度将呈指数级降低,每个帧占用1s,2s,4s,8s等。
// The default shortest interval/timeout we permit
#define DEFAULT_MIN_TIMEOUT_VALUE 4 // 4ms
#define DEFAULT_MIN_BACKGROUND_TIMEOUT_VALUE 1000 // 1000ms
IE不会限制setInterval
选项卡处于非活动状态时的延迟,但会requestAnimationFrame
在非活动选项卡中暂停。窗口是否未聚焦都没有关系。
从边缘14开始,setInterval
在不活动的选项卡中,上限为1000ms。requestAnimationFrame
总是在非活动标签中暂停。
与Chrome浏览器一样,setInterval
当该标签页处于非活动状态时,Safari的上限为1000毫秒。requestAnimationFrame
也暂停了。
自从采用Webkit引擎以来,Opera表现出与Chrome相同的行为。setInterval
上限为1000毫秒,requestAnimationFrame
当该标签页处于非活动状态时会暂停。
非活动标签的重复间隔:
setInterval requestAnimationFrame
Chrome
9- not affected not supported
10 not affected paused
11+ >=1000ms paused
Firefox
3- not affected not supported
4 not affected 1s
5+ >=1000ms 2ns (n = number of frames since inactivity)
IE
9- not affected not supported
10+ not affected paused
Edge
13- not affected paused
14+ >=1000ms paused
Safari
5- not affected not supported
6 not affected paused
7+ >=1000ms paused
Opera
12- not affected not supported
15+ >=1000ms paused