javascript - requestAnimationFrame - 告诉浏览器何时失去焦点

Question

根据我的阅读，requestAnimationFrame 可以判断浏览器何时失去焦点。发生这种情况时是否会触发某种事件？我正在寻找暂停和恢复与 requestAnimationFrame 相关的代码。

Answer 1

requestAnimationFrame 不是浏览器失去焦点时可以触发事件的元素；它只是设置了一个回调。但标准行为是，当浏览器/选项卡失去焦点时，回调将暂停。因此，很可能您的代码(如果在回调中)已被暂停。

有可能所有浏览器都不会暂停回调，而是减慢它们的速度。然而，W3C spec似乎意味着暂停，而不是减速:

Whenever a Document's hidden attribute ([Page Visibility]) is false and the animation frame request callback list is not empty, the user agent MUST regularly queue a task...

If d's hidden attribute is true, continue to the next entry in the contexts list.

如果你想绝对确定你的代码在选项卡失焦时暂停，或者如果你试图暂停的代码没有结构化为 RAF 回调的一部分，那么你可以考虑使用 Page Visibility API .

请注意，RAF 和 Page Visibility API 仅在 IE>=10 中可用。