🌟 Непопулярное, но полезное - Page Visibility API
Данное API предоставляет интерфейс для работы с видимостью текущей вкладки и переключения между ними, когда пользователь сворачивает и разворачивает окно. Также с его помощью можно приостанавливать long-polling или другие ресурсоемкие задачи, которые не нужно выполнять, когда пользователь "неактивен".
Примеры использования:
✅ Приостанавливать long-polling запросы к серверу
✅ Ставить на паузу автопроигрывание слайдера с картинками
✅ Отключать звук в видео или приостанавливать воспроизведение аудио
✅ Приостанавливать рендеринг данных, которые обновляются в реальном времени
✅ Собирать аналитические данные
И другие возможные ситуации, которые можно решить, используя доступный интерфейс.
Page Visibility API имеет всего лишь два свойства и одно событие для получения состояния видимости страницы:
🟡 document.hidden - возвращает булевое значение, доступно только для чтения.
🟡 document.visibilityState - возвращает одно из четырех значений:
- visible - страница активна (текущая вкладка активна и не свернута)
- hidden - страница неактивна
- prerender - страница находится в предварительном состоянии отрисовки
- unloaded - страница была выгружена из памяти
🟡 visibilitychange - событие document, которое возникает при изменении visibilityState
👋 Пример использования:
document.addEventListener("visibilitychange", function() {
if (document.visibilityState === "visible") {
console.log("Страница видима");
} else if (document.visibilityState === "hidden") {
console.log("Страница скрыта");
}
});
#javascript #dev
1 минута
31 июля 2024