JavaScript visibilitychange: пауза polling вкладки
Скрытая вкладка часто не нуждается в частом polling. Событие visibilitychange позволяет остановить таймер при уходе пользователя и возобновить его при возврате, уменьшая лишние запросы.
Рабочий пример
let timer;
function startPolling() {
if (timer) return;
timer = setInterval(refreshData, 15_000);
}
function stopPolling() {
clearInterval(timer);
timer = undefined;
}
document.addEventListener('visibilitychange', () => {
if (document.hidden) stopPolling();
else startPolling();
});
if (!document.hidden) startPolling();startPolling идемпотентна: повторное событие не создаст второй интервал. Замените refreshData своим запросом и очистите listener при уничтожении приложения.
Частый вопрос
Как сразу обновить данные после возврата?
Вызовите refreshData() внутри ветки else перед запуском таймера. Обработайте параллельные запросы, чтобы возврат вкладки не создал дубль.