Angular 團隊宣布推出 Angular DevTools，一個 Chrome DevTools 擴展，可以用來幫助檢查應用程序的結構并分析其性能。

日前，Angular 曾針對 Angular 開發者進行了一項調查發現，大多數人都需要更好的工具來調試其應用程序。其確定了最需要關注的領域包括有：錯誤信息的改進、理解變化檢測的執行、理解注入器層次結構和 provider 實例化，以及組件結構的可視化。

作為改善調試體驗項目的一部分，開發團隊已經為全局ng對象引入了新的 API。并致力于改善 Angular 的錯誤信息，提供了更多關于如何解決這些問題的信息和可操作的指導。為了讓開發者更好地了解如何配置應用程序，其還提供了有關使用 Chrome DevTools 進行性能分析的內容。

Angular 方面稱，為了解決其余的問題，并提供一個基于 Chrome DevTools 功能的 Angular 專用視圖，該團隊與 Rangle.io 合作開發了 Angular DevTools。Rangle 團隊曾為 Angular 構建了第一個調試工具 Augury，該工具已經為社區服務了多年。在此次合作中，雙方重用了從 Augury 獲得的經驗教訓，從頭開始開發了 Angular DevTools。

在當前版本中，Angular DevTools 專注于組件結構的可視化、以及理解變化檢測的執行。與 Augury 相似，Angular DevTools 提供了一個組件瀏覽器，可讓用戶預覽應用程序的結構。

它還提供了一個變化檢測周期的概述，幫助開發人員找到性能瓶頸，從而可以為用戶提供 60fps 的體驗。

Angular DevTools 支持用 Angular v9 及以上版本構建的、啟用了 Ivy 的應用程序。官方表示，Angular DevTools 提供了重要的缺失部分，可幫助用戶更好地了解應用程序的結構和運行時性能。在 Angular DevTools 的未來版本中，團隊將致力于填補 Augury 的功能空白，并根據用戶的要求考慮添加最具影響力的功能。

詳情可查看官方公告：https://blog.angular.io/introducing-angular-devtools-2d59ff4cf62f

本文轉自OSCHINA

本文標題：Angular DevTools 擴展發布，幫助改善調試體驗

本文地址：https://www.oschina.net/news/142461/angular-devtools