React Quantum Chrome 插件, crx 扩展下载
扩展ID: hhfmmpjgnlcdnicngllnglhbakdkcafk
React Quantum parses through your React application to create a color-coded tree model of its component hierarchy. On hover, each…React Quantum parses through your React application to create a color-coded tree model of its component hierarchy. On hover, each tree node will display two key component performance metrics—render time and re-render frequency—as well as memoized state and props to indicate what, specifically, initiated the render. The beauty is in the heat map: Nodes will change color depending on the component's rendering performance, making it easy to pinpoint possible bottlenecks at a glance. 🔥 How it works *PLEASE NOTE* - React Quantum utilizes the React Devtool to extract information about your React App. - Please ensure your project is running on React 16.0+ and that you have the React Devtool installed before using React Quantum. - Due to the minification of component names during bundling, React Quantum works best with your project bundled in development mode. 1. Open Chrome Developer Tools (Inspect) on any page that uses React, and click on React Quantum at the top of the Developer Tools panel. Upon pressing ‘Start Quantum’, a persistent connection is open and stored on the background page. 2. Refresh the page or set state to trigger a re-render. As the user interacts with the React application, the Mutation Observer listens for changes to the DOM and triggers a script injection to extract and parse the page’s fiber tree. 3. Hover over a node to view information like Component Name, Type, Commit Frequency, Render Time, Current State, and Props. 4. React Quantum runs with heatmap values out-of-the-box, but users could opt to customize their heatmap with percentage inputs at the top of the tree.
名称 | React Quantum |
插件标识 | hhfmmpjgnlcdnicngllnglhbakdkcafk |
平台 | Chrome |
评分 | 0 |
评分人数 | 10 |
插件主页 | |
作者 | React Quantum |
版本号 | 0.2.0 |
大小 | 828 KB |
官网下载次数 | 291 |
分类 | 查看更多 web开发 分类下的扩展插件 |
下载地址 | |
更新时间 | 2019-03-08 00:00:00 |
CRX扩展文件安装方法
打开Chrome浏览器的扩展程序: 地址栏直接输入:chrome://extensions/ 即可进入,将右上角的【开发者模式】开启,重启chrome(重要操作),再次打开扩展程序管理界面,把下载的crx直接拖动进去即可完成安装,注意请更新最新版本的chrome.
打开Chrome浏览器的扩展程序: 地址栏直接输入:chrome://extensions/ 即可进入,将右上角的【开发者模式】开启,重启chrome(重要操作),再次打开扩展程序管理界面,把下载的crx直接拖动进去即可完成安装,注意请更新最新版本的chrome.
回复
强烈推荐
相关推荐
大家在找这些插件
- 视频号
- ug
- Supercopy
- insgram
- acg
- 视频会员
- HPOI
- avtar
- acr
- Kimi
- antibot
- chandler
- 1passward
- Flash Copilot
- 黑暗模式-护眼
- 蓉城
- 税号
- Pornhub 视频免费下载器 Chrome 插件_DESKTOP
- 黑暗模式-夜眼
- hare
- ai渲染
- 超市投标书
- luccascovo.com
- commercialera.com
- wechatneedweb
- 多线程下载管理插件
- 多线程下载插件
- asciidoctor.js
- 标签页冻结
- uipx-chrome-plugin-master
- Koala Inspector
- palinsestotv.com
- magyargifts.com
- 秘密阅读助手
- 媒体流
- docs online viewer
- NTKO WEB chrome
- kimi阅读助手
- ungerboeck
- bookmark preview
- easy scraper
- been choice
- css pr
- popchatgpt
- zeroomega
- openh246
- bookmark preview - productivity and extensio
- kimi网页总结助手
- ai文生视频
- canvasblocker
- fuzz
- bookmark preview - productivity and extension
- rss feed reader
- free ???vp
- right-click image saver free
- notion web clipper
- speed conctroll
- baiduexport
- transkriptor
- ttpheader
- cog system view
- ublock origin 1.54.0
- troywell
- kimi copilot
- ai文字生视频
- asciidoctor.js live preview download chrome
- link preview sidebar
- asciidoctor.js live preview
- tinamind
- 视频网页全屏
- 跳墙
- trancyt
- 文章总结
- mpi-corporation.com
- Pornhub è§é¢å è´¹ä¸è½½å¨ Chrome æ件
- 安全协议
- Kimi网页总结助手
- Kimi阅读助手
- elmo
- Easy Scraper
- mega303bet.jimdosite.com
- megapari2023com.jimdosite.com
- chart gpt
- infinity标签页
- enblecopy
- hala
- Right-click Image Saver Free
- COG SYSTEM VIEW
- COG
- dynamics power pane
- dynamics crm
- 复制文字
- 网页 复制
- Kimi Copilot
- UBlock
- vvload
- Persepolis
- 视频限制
相关搜索词
- Quantum
- react
- react-devtools
- React Developer Tools
- react dev tool
- react dev
- react-devtool
- React Devtools
- React
- react developer tools
- react-developer-tools
- react developer
- react-devtoll
- React DevTools
- react dev tools
- React-devtools
- react devtool
- react devtools
- devtools-react
- react-dev-tools
- React dev
- React Developer Tool
- react.js.devtools
- react developer tool
- react develop
- React-Developer-Tools
- react-tool
- REACT
- React Developer
- react chrome