How can I make my Live Feed list update only on the active tab or update it when the tab becomes active again?

I have a Live Feed jQuery box which updates in every 10 seconds, and puts the sites latest comments on top. This is working fine: jQuery makes an Ajax request, calls a PHP, which returns new items or none.

This box is like a sidebar, it is on every page on my site. My problem is that if a user opens many pages on the site, every tab he opened will do this auto-refresh until he closes that tab. So with a few dozen users each opening many pages this becomes a problem, even if the Live Feed is well optimized, and the SQL query behind it is fast (0.0005 seconds per query). Also if the user leaves the browser open with a couple of opened tabs, and start browsing somewhere else, or watch a movie they’ll update forever, or until he closes them.

So what is a nice solution for this? Can I make my feed update only if its tab/window is visible/active? Is there an event which will fire if it was inactive and now active again?

Answer

Try adding onFocus event on the window object to trigger your updates and add onBlur to stop updating your live feeds.

Since you are using jquery you can do this

$(window).('focus',function(){
  //do updates
})

$(window).('blur',function(){
  //stop updates
})

Advertisement

Answer