How to check how many tabs the site is open? To avoid a high load on the server, for example, if for example on the site every few seconds there are several requests to the server. Let's say a person has 10 tabs open, but only 1 uses. As a result, another 9 send 5 requests to the server every 2 seconds, although there is no sense from this.

  • Use localStorage , Luke! - Darth
  • But as? There are accurate events of opening, closing tabs? And if they closed the browser or electricity chopped off. It just interests. - manking
  • well, so I didn’t write the answer) opening and closing events are there, and when closing the browser, it also seems to work, but it’s not clear what the electricity was cut off. window.onbeforeunload , window.unload - Darth
  • Wouldn't it be better to check if the current tab is active, and if not, just not to send requests? - Yaant
  • Just the way I want. - manking

3 answers 3

In modern browsers inactive tabs are able to almost freeze. For example, in chrome, timers processing stops, requestAnimationFrame stops.

If you answer the question in general, check to start with some statistics what percentage of the audience opens several tabs, otherwise all further optimizations will be extremely insignificant.

  • Well, I see on my server that the number of requests increases greatly when there are a lot of tabs open. - manking
  • @manking That's when I experimented with D3 and timers, I wrapped the server polling code in the d3-timer library, when I left the tab, requests stopped, this can be seen even by devtools. - ReklatsMasters

Once did so. We set the interval, each time increasing the counter. If the counter has reached a certain value, we do not send requests to the server. If any movement occurs on the page (events below), then the counter is reset, if necessary, we start sending requests for a new one.

window.onscroll - scroll the page

window.onmousemove - mouse movement

window.onfocus - go to tab

window.onkeydown - keystroke

window.onclick - mouse click

You can make it easier and follow only onfocus / onblur.

But if the user is waiting for some event from the site and decided to look at something else while waiting, opening a second window next to it, then he will not get anything from the site.

From the comments I found the most correct solution for my problem.

Using the Page Visibility API

document.hidden

If the tab is visible, then the page should be updated, if not visible then there is no point in updating. The number of tabs does not matter. This is suitable for the online editor, when you need to regularly check whether anyone has changed the document you are editing now, but it is important not to send 20 requests from 20 open tabs.

Onfocus and onblur solutions have many disadvantages. One of them is for example working with 2 monitors, we opened the tab, switched to another window, but still see our tab, but having lost focus, it stopped updating, although it is still visible, and not the fact that it contains the latest information. If you need to freeze the visible tab, then you will have to hang up different events to make sure that the user is "active".