UD5工具箱
使用教程
以下是使用本工具监控页面生命周期事件的详细步骤说明。
第一步：查看当前页面状态
打开工具页面后，您会在页面顶部看到当前的页面状态指示器面板。状态指示器会显示页面当前的可见性状态（可见或隐藏）和活跃性状态（活跃或不活跃）。
初始加载状态下，页面应该是可见且活跃的，状态指示器会显示为绿色高亮状态。随着您进行各种浏览器操作，状态指示器会实时更新以反映页面的当前生命周期状态。
第二步：触发生命周期事件
通过以下不同的浏览器操作可以触发各种生命周期事件：
- 切换到其他标签页 - 触发 visibilitychange 事件，页面状态变为隐藏
- 最小化浏览器窗口 - 触发 visibilitychange 事件
- 切换回本标签页 - 触发 visibilitychange 事件，页面恢复为可见状态
- 长时间不进行任何操作 - 可能触发 freeze 事件（浏览器冻结后台标签页）
- 从冻结状态恢复运行 - 触发 resume 事件
第三步：观察事件日志记录
当生命周期事件被触发时，下方的事件日志区域会立即显示新事件的详细信息：
- 事件名称标识 - 事件的具体类型（如 visibilitychange、freeze、resume 等）
- 触发时间戳 - 事件触发的精确时间（精确到毫秒级别）
- 附加状态数据 - 事件相关的额外信息（如页面当前可见性状态值）
同时，事件统计面板会自动更新对应事件类型的触发次数计数器。
第四步：使用新窗口进行测试
点击新窗口测试按钮会打开一个新的浏览器窗口。在新窗口中进行页面切换和标签页操作，可以更方便地触发各种生命周期事件，同时不影响当前工具页面的日志记录和状态显示。
这种方法特别适合需要同时监控多个页面生命周期事件的测试场景，您可以在主窗口中查看事件日志，在新窗口中执行触发操作。
第五步：导出和分析日志数据
测试完成后，您可以将所有事件日志导出为 JSON 格式文件保存到本地设备。导出的数据包含事件名称、时间戳和状态信息，方便进行后续的详细数据分析和处理。
如果需要重新开始新的测试，可以使用清除日志功能清空所有已记录的事件数据。