窗口焦点检测
窗口焦点检测会实时显示你的浏览器窗口当前是处于聚焦状态、已被其他应用夺走焦点，还是标签页已被隐藏。它同时读取浏览器的 focus 和 blur 事件以及 Page Visibility API，逐刻呈现窗口被使用情况的准确画面。
它专为编写焦点与可见性感知代码的开发者而设计 —— 例如暂停视频、降低轮询频率、停止动画，或在标签页离开视野时保存状态 —— 同样也适合任何想测量自己离开页面频率的人。
无需再去猜测 focus、blur 和 visibilitychange 的行为，你可以实时观察事件触发、看到浏览器报告的确切值，并查阅每一次变化的带时间戳历史记录。
如何使用窗口焦点检测
从已聚焦状态开始
打开工具，查看大号状态横幅。它最初处于已聚焦状态，表示此窗口已获得焦点且可见。
点击其他窗口
在保持此标签页停留在屏幕上的同时，点击另一个应用。横幅会变为失去焦点 —— 窗口失去了焦点，但标签页依然可见。
切换标签页或最小化
切换到另一个浏览器标签页，或最小化窗口。横幅会变为已隐藏，因为标签页本身已不再可见。
观察统计与日志
返回此标签页，即可看到状态翻回已聚焦，事件日志中也会出现一条新记录。统计卡片实时更新：聚焦时长、离开时长、失去焦点次数、标签页切换次数以及最长聚焦时间。
卡片下方的原始读数会显示每一刻 document.hasFocus() 与 document.visibilityState 的确切值。点击清空可清除事件日志，点击重置可将所有计数器清零并开启全新的测量会话。
功能特性
三态检测
跟踪已聚焦、失去焦点（窗口失焦）和已隐藏（标签页不可见）三种状态，由 document.hasFocus() 和 document.visibilityState 推导得出，不受事件触发顺序影响。
实时聚焦与离开计时
聚焦总时长与离开总时长持续更新，同时还有当前状态计时器和整个会话的计时器。
独立计数器
窗口失去焦点的次数与标签页切换的次数分别计数，因此点击其他窗口与切换标签页能够被区分开来。
最长聚焦时间
记录你最长一段不间断的聚焦时间，并随当前聚焦时间的增长而实时更新。
原始 API 读数
显示 document.hasFocus() 返回的实时布尔值，以及 document.visibilityState 返回的字符串。
带时间戳的事件日志
每一次状态变化都会以最新在前的方式记录，附带时间戳和上一状态的时长，保留最近 100 条事件。
防节流计时
时间由时间戳计算得出，而非依赖运行中的计数器，因此浏览器对后台计时器的节流不会扭曲总时长。
清空与重置控件
清空会清除事件日志，重置则会将所有计数器和计时器清零，开启全新的测量会话。
深色模式
内置深色主题让状态横幅、统计和日志在弱光环境下依然清晰可读。
常见问题
如何检测浏览器窗口是否获得焦点？
打开此工具并查看状态横幅。当窗口拥有键盘焦点且可见时，会显示已聚焦，原始读数中 document.hasFocus() 报告为 true。点击其他窗口或切换标签页，即可立即看到状态和值的变化。
“失去焦点”和“已隐藏”有什么区别？
失去焦点表示窗口失去了焦点 —— 例如你点击了另一个应用 —— 但标签页仍然显示在屏幕上。已隐藏表示标签页本身已不再可见，例如你切换到另一个标签页或最小化了浏览器。
document.hasFocus() 和 visibilitychange 有什么区别？
document.hasFocus() 告诉你窗口当前是否拥有输入焦点，而 visibilitychange 会在标签页的 document.visibilityState 在 visible 与 hidden 之间切换时触发。窗口可能可见却未聚焦（你点击了另一个应用），因此本工具结合这两个信号，报告出一个可靠的单一状态。
如何检测用户切换标签页？
监听 visibilitychange 事件并检查 document.hidden。当标签页隐藏时，说明用户已切走或最小化；当它返回时，document.hidden 又会变回 false。本工具会实时演示这一流程，并在每次标签页变为隐藏时递增一个独立的标签页切换次数计数器。
为什么页面仍然可见时 blur 事件却被触发？
blur 事件跟踪的是输入焦点，而非可见性。点击其他窗口或打开开发者工具会把键盘焦点移走，因此 blur 会触发，document.hasFocus() 返回 false，即便页面仍然显示在屏幕上。本工具会将这种情形准确报告为失去焦点状态。
为什么一次标签页切换有时会出现两条日志？
某些浏览器会在可见性变化之前先触发 blur。在这种情况下，窗口先变为失去焦点，再变为已隐藏，因此两次转换都会被记录。计数器仍会正确递增 —— 一次记离开焦点，一次记标签页变为隐藏。
标签页处于后台时计时器还准确吗？
准确。时间是由时间戳计算得出的，而非依赖运行中的计数器，因此浏览器对后台计时器施加的节流不会影响总时长。
关闭页面后工具会保留我的数据吗？
不会。每次访问都会开启一个全新会话，所有处理都在你的浏览器本地完成，不会保存或发送任何内容到任何地方。
还没有评论，快来发表第一条！