文件名称:ng-profiler:用于Ivy,调试和可视化工具的Angular Profiler
文件大小:1.19MB
文件格式:ZIP
更新时间:2024-02-19 21:16:52
chrome-extension angular ivy change-detection ChromeextensionTypeScript
角度轮廓仪 Angular Profiler是一个开发人员工具,它通过提供一系列调试工具来启动Angular开发工作流。 可用作 它如何帮助我们获得更好的开发经验和/或构建更快的应用程序 视觉变化检测和组件树 Angular Profiler提供了多种方法来帮助我们调试Angular应用程序中过度触发的更改检测。 1.突出显示触发CD的组件,并用不同的颜色指示CD时间。 2.视觉检测组件树中的更改 组件树将向您展示如何渲染和更新角度组件 检查并更改组件状态 在组件树中选择一个组件,然后可以在properties选项卡中查看该组件的所有状态。 您可以立即更新组件,而无需更改代码,而无需等待Webpack编译以查看更改。 那太棒了! :smiling_face_with_sunglasses: 在本地尝试 // init project and install dependences yarn // package plugin in watch mode yarn watch // package and compile devtools page app in watch mode
【文件预览】:
ng-profiler-master
----images()
--------icon48.png(1KB)
--------highlight.png(91KB)
--------icon48_disabled.png(2KB)
--------icon128.png(4KB)
--------icon16.png(531B)
--------icon148_disabled.png(6KB)
--------component-tree.gif(411KB)
--------state.png(257KB)
--------ng-profiler.gif(163KB)
--------icon16_disabled.png(607B)
--------component-tree.png(312KB)
----package.json(616B)
----popup.html(3KB)
----manifest.json(1KB)
----cleanup.sh(165B)
----tsconfig.json(652B)
----devtools.html(172B)
----.gitignore(27B)
----webpack.config.js(903B)
----README.md(2KB)
----yarn.lock(414KB)
----packages()
--------communication()
--------core()
--------background.ts(1KB)
--------devtools.ts(96B)
--------devtools-page()
--------content-script.ts(4KB)
--------popup()