PageSpy

PageSpy 是一个支持多种平台(Web、鸿蒙原生App、小程序、React Native)的项目调试工具,提供实时调试和新增的离线回放模式,帮助开发者更高效地调试和解决问题。

前言去年(2023.11 )有幸上过一次周刊,https://github.com/ruanyf/weekly/issues/3616 。本次投稿是因为在过去半年的时间里,PageSpy 的能力丰富了许多,期望再次上榜让 PageSpy 帮助到更多开发者。# 正文## PageSpy 仓库地址https://github.com/HuolalaTech/page-spy-web/## 自荐描述PageSpy 在去年仅支持「针对 Web 端项目的远程实时调试」。如今的 PageSpy 有哪些不同:- 支持更多的平台 - (去年已有)支持 Web 调试; - (新增)支持调试鸿蒙原生 App; - (新增)支持调试小程序:微信原生小程序、支付宝原生小程序、UniApp 小程序、Taro 小程序; - (新增)支持调试 React Native;- 新增 离线回放模式 PageSpy 的实时调试模式确实解决了一部分问题,但使用实时调试要求:「客户端和调试端必须同时在线」。这个前置条件无论是给开发者还是 PageSpy 自身都带来很多不便和局限性。比如: - 针对一个问题要同时投入开发和测试两个人力; - 调试期间客户端退到后台导致连接断开了; - PageSpy 要考虑处理的数据大小、网络传输的压力; 针对上述问题,我们新增了「离线回放模式」。## 离线回放模式在这个模式下的客户端可以完全处于离线状态,客户端出现问题后只需要把日志提供给开发者即可,开发者通过 PageSpy 使用日志回放,在回放面板上可以看到:用户的操作轨迹、跟随着回放时间输出的客户端运行数据,回放时间轴的交互符合用户直觉,支持点击倍速回放、跳转到指定时间、拖动。点击体验:https://test.jikejishu.com/#/log-listreplay-page-a1f617cc# 总结> "为什么是 PageSpy?"> 一图胜千言。image