3

From what I have read requestAnimationFrame can tell when the browser loses focus. Is there some kind of event that fires when this occurs? I'm looking to pause and resume code in connection with requestAnimationFrame.

Kahless
  • 1,213
  • 2
  • 13
  • 31
  • Where did you read that? Reference please. `requestAnimationFrame` is not an element on which an event can be fired when the browser loses focus; it just sets up a callback. Standard behavior is that when the browser/tab goes out of focus, callbacks are paused. Therefore, most likely your code (if in a callback) is already being paused. –  Nov 21 '14 at 01:02
  • 1
    I might be remembering wrong but I thought requestAnimationFrame reduces frame rate when the browser loses focus. I'll edit my question if this is not correct. – Kahless Nov 21 '14 at 01:13
  • I'm guessing the precise behavior is browser-dependent. It may slow down, or it may pause, or somewhere I saw a claim that it pauses but only after some time has elapsed. Only engine developers know for sure. I could run some tests but I'm too lazy. –  Nov 21 '14 at 01:23
  • The W3C spec would seem to imply pausing, not slowing. "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...", then "If d's hidden attribute is true, continue to the next entry in the contexts list." See http://www.w3.org/TR/animation-timing/. –  Nov 21 '14 at 01:28
  • 1
    Do you think I would be better off using that "Page Visibility API". http://stackoverflow.com/questions/1060008/is-there-a-way-to-detect-if-a-browser-window-is-not-currently-active/1060034#1060034 – Kahless Nov 21 '14 at 01:30
  • Also there is an answer on that page with over 200 up votes. I was wondering if you could help me out with some thing. Why is this function in parentheses? Also how Would I go about using this. Do I just call it once and put whatever code I need to run within the onchange function? Sorry for my lack of knowledge. – Kahless Nov 21 '14 at 01:43
  • I would say some testing is required, but basically it depends on what you want to do. If the processing you want to pause is all in RAF callbacks, and you think you can rely on it be paused, not just slowed, on out-of-focus tabs, then that should do the job. Otherwise, you might need to look at the Page Visibility API. In either case, you're out of luck with IE<=9. –  Nov 21 '14 at 01:43
  • The code on the page you refer to is wrapped in an anonymous function to isolate the one-time sniffing of whether the API is available. Yes, fundamentally you just need to put your code in the `onchange` method there. –  Nov 21 '14 at 01:45
  • So to use it I should start off with some thing like function pauseResumeCode(function() { ...... })(); – Kahless Nov 21 '14 at 01:50
  • I played around with it a bit and got it to work. Sorry for all the questions and thanks for all the help. This will end up making things much easier for me. – Kahless Nov 21 '14 at 02:10

1 Answers1

1

requestAnimationFrame is not an element on which an event can be or is fired when the browser loses focus; it just sets up a callback. But standard behavior is that when the browser/tab goes out of focus, callbacks are paused. Therefore, most likely your code (if in a callback) is already being paused.

There is a possibility that all browsers may not pause callbacks, but instead slow them down. However, the W3C spec would seem to imply pausing, not slowing:

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.

If you want to be absolutely sure your code is pausing when the tab is out-of-focus, or if the code you are trying to pause is not structured as part of a RAF callback, then you could consider using the Page Visibility API.

Note that both RAF and Page Visibility API are available only in IE>=10.

Community
  • 1
  • 1