Reactime Chrome插件是一款基于谷歌瀏覽器使用的React開發者的調試工具。軟件功能很強大,過記憶每次渲染時組件的狀態來幫助調試React應用。它以 “快照 ”的形式記錄應用程序的狀態變化,并允許用戶跳轉到之前記錄的任何狀態,擴展了對有條件狀態字段的組件的支持。
插件介紹
一個Chrome擴展,通過記憶每次渲染時組件的狀態來幫助調試React應用。
Reactime被提名為2020年React開源獎的生產力促進獎!
Reactime是React開發者的調試工具。它將應用程序的狀態變化記錄為 “快照”,并允許用戶跳轉到之前記錄的任何狀態。
該工具適用于使用有狀態組件和道具鉆井的React應用,測試版支持Recoil、Context API、條件狀態路由、Hooks(useState、use Effect)和功能組件。
第6版通過新的可視化增強了用戶體驗,更好地將目標應用程序中的狀態數據和組件關系上下文化,同時修復了各種bug?,F在可以在歷史標簽中通過點擊任何節點來完成時間跳轉。歷史和地圖選項卡現在都有一個動態圖例,使可視化更有表現力和意義。地圖選項卡中的核心可視化器已被替換,現在提供了各種方向、布局和節點鏈接。性能選項卡現在以堆疊條形圖的形式顯示快照,為用戶提供狀態變化時組件渲染時間的鳥瞰圖。最新的版本在可視化中加入了新的onHover功能,用戶可以將組件的表現形式(如地圖標簽中的節點或性能標簽中的條形圖)懸停,其對應的HTML元素將在DOM中突出顯示。
安裝方法
1、在打開的谷歌瀏覽器的擴展管理器
就是點擊最左側的三個點,在彈出的菜單中選擇【更多工具】——【擴展程序】;
或者你可以在地址欄中直接輸入chrome://extensions/
2、進入擴展程序頁面后將開發者模式打勾;
3、最后將解壓出來的crx文件拖入到瀏覽器中即可安裝添加;
4、如果出現無法添加到個人目錄中的情況,可以將crx文件右鍵,然后選擇【管理員取得所有權】,再嘗試重新安裝;
5、安裝好后即可使用。