LOADING

Reactime

Reactime15.0.0

一个 Chrome 扩展,通过记住每次渲染的组件状态来帮助调试 React 应用程序。 Reactime 被提名为 2020 年 React 开源奖的生产力助推器奖。 Reactime 是一个开源的 Chrome 开发者工具,用于在 React 应用程序中进行时间旅行调试和性能监控。 Reactime 使开发人员

官方版无广告31

更新日期:2021年 8月 29日分类标签:语言:中文平台:

2.11MB 0 人已下载 手机查看

简介:
一个 Chrome 扩展,通过记住每次渲染的组件状态来帮助调试 React 应用程序。 Reactime 被提名为 2020 年 React 开源奖的生产力助推器奖。 Reactime 是一个开源的 Chrome 开发者工具,用于在 React 应用程序中进行时间旅行调试和性能监控。 Reactime 使开发人员能够记录应用程序状态的快照、在状态快照之间跳转和检查状态快照,以及监控组件渲染时间和渲染频率等性能指标。 Reactime 支持使用有状态组件和 Hooks 的 React 应用程序(现在包括 React Router 应用程序),测试版支持 Recoil 和 Context API 以及 Gatsby 和 Next.js 等框架。 Reactime 15.0 添加了一个新的可视化,允许用户在特定快照的各个组件上进行分区。此外,还实施了许多错误修复。目前,Reactime 支持使用有状态组件和 Hooks 的 React 应用程序(现在包括 React Router 应用程序),测试版支持 Recoil 和 Context API 以及 Gatsby 和 Next.js 等框架。此前,Reactime 14.0 添加了以下令人兴奋的功能:反应路由器兼容性Reactime 现在与 React Router 应用程序兼容!在 Reactime 14.0 之前,可以在用户浏览各种路线时记录状态快照,但只能对当前路线进行时间旅行调试(即无法跳回到不同路线的先前状态)。为了简化具有多个路由的应用程序的调试,Reactime 14.0 添加了允许用户回到不同路由的功能,包括在浏览器中实时更新以反映他们的应用程序在先前访问的路由上的状态。按路线分类状态快照Reactime 仪表板中的状态快照列表现在按路由分类,为开发人员提供快照-路由关系的视觉提示,并使各种路由的时间旅行调试更容易。按路由过滤性能指标Reactime 仪表板包括一个堆叠条形图,显示每个组件的渲染时间,每个快照都有一个单独的条形图。在 Reactime 14.0 中,现在可以按路线过滤此复合条形图,以允许开发人员按路线查看详细的性能数据。特征: – 组件树可视化- 记录应用状态快照- 时间旅行调试- 快照系列比较- 组件渲染时间和频率- 支持 Gatsby 和 Next.js – 对 TypeScript 的 Beta 支持- 教程演练故障排除:为什么 Reactime 告诉我没有找到 React 应用程序? Reactime 最初使用来自 Chrome API 的开发工具全局钩子运行。 Chrome 需要时间来加载它。尝试刷新您的应用程序几次,直到您看到 Reactime 正在运行。出现黑屏而不是 Reactime 扩展。尝试刷新您要测试的应用程序,并通过单击鼠标右键“重新加载框架”来刷新 DevTools。我在 Reactime 中发现了一个错误。 Reactime 是一个开源项目,我们非常感谢您帮助改善用户体验。请创建拉取请求(或问题)以提议和协作对存储库进行更改。延伸阅读: https://medium.com/better-programming/time-traveling-state-with-reactime-6-0-53fdc3ae2a20 https://medium.com/@aquinojardim/react-fiber-reactime-4-0-f200f02e7fa8 https://medium.com/@yujinkay/meet-reactime-a-time-traveling-state-debugger-for-react-24f0fce96802 https://itnext.io/deep-in-the-weeds-with-reactime-concurrent-react-fiberroot-and-browser-history-caching-7ce9d7300abb https://rxlina.medium.com/time-traveling-through-react-state-with-reactime-9-0-371dbdc99319 https://medium.com/@liuedar/what-time-is-it-reactime-fd7267b9eb89 https://medium.com/@christinaor/uncovering-reactime-understanding-react-fiber-redux-compatibility-and-zoning-in-on-components-59f0758e0fa3

相关资源

字体检测
检测网页字体字体探测可以非常快速的识别网站所用的字体,只需把鼠标放在需要识别的字体上,就可以显示出该处字的详细信息
IP Location Lookup
ipwhois.io 的 IP 位置查询简单易用的地理定位扩展,显示 IP 地址的位置,以及其他有用的数据,例如: ■ 外部IP ■ 纬度和经度■ 大陆■ 国家■ 地区■ 城市■ 时区■ 货币使用我们自己的 IP 地理定位 API
Live CSS Editor
将 CSS 实时写入任何页面此扩展在任何 HTML 页面上提供了一个文本框,以便您可以自由编写 CSS 并立即查看结果。我每天都使用它进行快速编辑、产品演示和其他测试新想法的工作。扩展选项允许您设置默认的键盘命令来打开和关闭编辑器;关闭关闭编辑器时显示的警告;并在关闭编辑器时启用或禁用自动保存更改。版本 1.8.
Scraper Parsers – Free Web Scraping
Scraper 从 HTML 网页中提取数据并将其导入到 excel、xls、xlsx、csv、json、xml 文件中。重要的!仅在网站的 1 个详细页面上选择必要的数据类型。我们的技术本身会在网站上找到类似的页面并为您提取必要的数据。抓取工作基于机器学习自动进行。与其他网络抓取工具相比,无需指定所有页面、目录
HREF Pro URL Shortener
这个工具将帮助您将一个又长又复杂的链接变成一个短链接。缩短的链接在您的帖子和消息中看起来更好......这个工具将帮助您将一个又长又复杂的链接变成一个短链接。缩短的链接在您的帖子和消息中看起来更好,并且更容易复制。你得到: * 快速短网址* 快速二维码* 完整统计* 在社交媒体上快速分享现场更多功能: *密码保护
F8NLink
它显示了您可以导航的任何网页的图像链接。使用扩展程序,您将能够获得网页中存在的不同链接,并且可以以最方便的方式使用它们。

暂无评论

暂无评论...