how to stop setInterval auto-refresh when page/tab is inactive?

Question

i have a javascript to parse twitter feeds and show them in a block in my page every 30 seconds, the code is something like this:

var auto_refresh = setInterval(
function ()
    {
        //get twitter feeds
    });
}, 30000);

now in case the user minimized his browser or switched to another tab (page is not active) i want to disable this auto_referesh clearInterval(auto_refresh);

Thanks for your help

Answer 1

Here is the answer:

Is there a way to detect if a browser window is not currently active?

Answer 2

You may want to check out

• How can I detect whether a browser window is focused or not?
• Determine whether webpage has foreground window focus/is active tab?
• How to tell if browser/tab is active
• Is it possible to tell if a user has my page minimized or the inactive tab?
• Is there a way to detect if a browser window is not currently active?
• https://odondo.wordpress.com/2007/08/28/javascript-and-cross-browser-window-focus/

Also note that Chrome apparently has some optimizations that slow down the firing of the timer when the tab is not in focus: How can I make setInterval also work when a tab is inactive in Chrome?

Answer 3

This answere is pretty clean: https://stackoverflow.com/a/18677784/9027171

An excerpt from the answer of infinito84

 if(!document.hasFocus()){
       // The tab is not active
 }
    else{
       // The tab is active
 }