前端知库

Page Visibility API 适合处理哪些页面生命周期场景?

使用 visibilitychange 感知页面进入后台,降低不必要的轮询和动画开销,同时理解它不能替代页面卸载通知。

参考答案

document.visibilityState 通常是 visible 或 hidden,visibilitychange 在状态变化时触发。页面进入后台时,可以暂停非必要动画、降低轮询频率、暂停视频或延迟刷新;恢复可见时再同步状态。

它不是“页面即将关闭”的可靠通知,也不保证浏览器会在进程被杀死前给脚本足够时间保存数据。需要持久化的状态应尽早写入合适的存储,并设计幂等恢复流程。后台页面的计时器和网络调度也可能被浏览器节流,不能依赖精确的定时器。

处理媒体和实时连接时要区分产品需求:暂停轮询不等于关闭 WebSocket,关闭连接也不等于服务端立刻停止任务。恢复时应重新校验服务器状态,而不是假设本地计时器连续运行。