Reactime Chrome插件是一款基于谷歌瀏覽器使用的React開發(fā)者的調(diào)試工具。軟件功能很強大,過記憶每次渲染時組件的狀態(tài)來幫助調(diào)試React應用。它以 “快照 ”的形式記錄應用程序的狀態(tài)變化,并允許用戶跳轉(zhuǎn)到之前記錄的任何狀態(tài),擴展了對有條件狀態(tài)字段的組件的支持。

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