Retime 是一款开源 Chrome 开发者工具，用于 React 应用程序中的时间旅行调试和性能监控。 Retime 使开发人员能够记录应用程序状态的快照、在状态快照之间跳转和检查状态快照，以及监视组件渲染时间和渲染频率等性能指标。
特征：
- 记录应用程序状态快照
- 导入和导出状态快照
- 时间旅行调试
- 快照系列比较
- 组件树可视化
- 反应路由器兼容性
- 组件渲染时间和频率
- 支持 Gatsby、Next.js 和 Remix
- TypeScript 支持
- 重新连接的能力
- 网络性能指标
- 教程演练
什么是新的！
Retime 22.0 预示着显着的增强，解决了核心性能问题并增强了整个应用程序的稳定性和可靠性。为了追求一致的发展，我们更新了过时的软件包，并将状态管理过渡到 Redux Toolkit。这一战略转变不仅使我们的技术堆栈现代化，而且确保我们的应用程序在未来更容易维护和扩展。作为对这些升级的补充，此版本还修复了各种错误。重新连接按钮、状态图标等功能的首次亮相以及关键 Web 指标的集成（累积布局偏移 (CLS) 和下次绘制交互 (INP)）增强了其功能，并为用户提供了更精致的体验。
故障排除：
为什么 Retime 告诉我没有找到 React 应用程序？
Retime 最初使用 Chrome API 中的开发工具全局挂钩运行。 Chrome 需要一些时间来加载它。尝试刷新应用程序几次，直到看到 Retime 正在运行。
为什么我需要启用 React Dev Tools？
Retime 与 React Developer Tools 协同工作来访问 React 应用程序的 Fiber 树；在底层，Retime 通过 React Developer Tool 的全局钩子遍历 Fiber 树，拉取向开发人员显示所需的所有相关信息
有黑屏而不是Retime扩展
尝试刷新您要测试的应用程序，并通过单击鼠标右键“重新加载框架”刷新 DevTools。
我在 Retime 中发现了一个错误
Retime 是一个开源项目，我们很乐意听取您关于改善用户体验的意见。请阅读 GitHub 中的开发人员自述文件并创建拉取请求（或问题）以提出和协作对 Retime 进行更改。
插件说明
Retime 是一款开源 Chrome 开发者工具，用于 React 应用程序中的时间旅行调试和性能监控。 Retime 使开发人员能够记录应用程序状态的快照、在状态快照之间跳转和检查状态快照，以及监视组件渲染时间和渲染频率等性能指标。
扫码关注公众号，发【识别码】获取
