填寫這份《一分鐘調查》,幫我們(開發組)做得更好!去填寫Home

Angular 路線圖

Angular Roadmap

Angular 從 Google 內部和更廣泛的開源社群都收到了大量的特性請求。與此同時,我們的專案列表包含大量維護任務、程式碼重構、潛在的效能提升等等。我們彙集了來自來自開發者關係部門、產品管理部門和工程部門的代表,以確定此列表的優先順序。當新專案進入佇列時,我們會根據其它專案的相對優先順序定期對它們進行排位。當工作完成後,專案就會在佇列中向上移動。

Angular receives a large number of feature requests, both from inside Google and from the broader open-source community. At the same time, our list of projects contains plenty of maintenance tasks, code refactorings, potential performance improvements, and so on. We bring together representatives from developer relations, product management, and engineering to prioritize this list. As new projects come into the queue, we regularly position them based on relative priority to other projects. As work gets done, projects will move up in the queue.

下面這些專案並沒有關聯到特定的 Angular 版本。我們會在完成時發佈它們,它們會根據我們的發佈計劃,並遵循語義化版本規範,變成特定版本的一部分。例如,當完成各種特性後會在下一個次要版本中發佈,如果包含重大變更,則會到下一個主版本中發佈。

The projects below are not associated with a particular Angular version. We'll release them on completion, and they will be part of a specific version based on our release schedule, following semantic versioning. For example, features are released in the next minor after they are complete, or the next major if they include breaking changes.

進展中

In Progress

透過在 Universal 應用中內聯關鍵樣式來加速應用的速度

Faster apps by inlining critical styles in Universal applications

載入外部樣式表是一種阻塞性操作,這意味著在載入完所有參考的 CSS 之前,瀏覽器無法開始渲染你的應用。在頁首中使用阻塞渲染的資源會對其載入效能產生很大的影響,例如,它的首次內容繪製。為了讓應用更快,我們一直在與谷歌 Chrome 團隊合作,以內聯關鍵性 CSS,並非同步載入其他樣式。

Loading external stylesheets is a blocking operation, which means that the browser can’t start rendering your application until it loads all the referenced CSS. Having render-blocking resources in the header of a page can significantly impact its load performance, for example, its first contentful paint. To make apps faster, we’ve been collaborating with the Google Chrome team on inlining critical CSS and loading the rest of the styles asynchronously.

使用更好的 Angular 錯誤資訊改進除錯體驗

Improve debugging with better Angular error messages

錯誤資訊通常會帶來有限的可操作資訊,以幫助開發者解決問題。我們一直致力於透過新增相關程式碼、開發指南和其他材料來讓錯誤資訊更容易被發現,以確保更順暢的除錯體驗。

Error messages often bring limited actionable information to help developers resolve them. We’ve been working on making error messages more discoverable by adding associated codes, developing guides, and other materials to ensure a smoother debugging experience.

改進效能儀表盤來檢測效能退化

Revamp performance dashboards to detect regressions

針對每次程式碼更改,我們都會執行一組基準來確保 Angular 符合我們的效能標準。為確保框架的執行時部分在程式碼更改後不會退化,我們需要優化儀表盤中的一些現有基礎架構。

We have a set of benchmarks that we run against every code change to ensure Angular aligns with our performance standards. To ensure the framework’s runtime does not regress after a code change, we need to refine some of the existing infrastructure the dashboards step on.

更新我們的 e2e 測試策略

Update our e2e testing strategy

為了確保我們能提供面向未來的 e2e 測試策略,我們希望評估 Protractor 的狀態、社群的創新、e2e 最佳實踐,並探索新的機會。

To ensure we provide a future-proof e2e testing strategy, we want to evaluate the state of Protractor, community innovations, e2e best practices, and explore novel opportunities.

Angular 函式庫使用 Ivy

Angular libraries use Ivy

在 2020 年早些時候,我們共享了一個用於 Ivy 函式庫發佈方式的 RFC。經過社群的寶貴反饋,我們開發出了該專案的設計方案。我們現在正致力於 Ivy 函式庫發佈方式開發,包括更新函式庫套件的格式,以便使用 Ivy 編譯,繼續推進棄用 View Engine 函式庫格式以及 ngcc

Earlier in 2020, we shared an RFC for Ivy library distribution. After invaluable feedback from the community, we developed a design of the project. We are now investing in the development of Ivy library distribution, including an update of the library package format to use Ivy compilation, unblock the deprecation of the View Engine library format, and ngcc.

確保順利採用 RxJS(v7 及更高版本)

Ensure smooth adoption for future RxJS changes (v7 and beyond)

我們希望確保 Angular 開發人員能夠充分利用 RxJS 的最新功能,順利過渡到本框架的下一個主要版本。為此,我們將探索並記錄 RxJS 中 v7 及更高版本的變更範圍,並制定更新策略。

We want to ensure Angular developers are taking advantage of the latest capabilities of RxJS and have a smooth transition to the next major releases of the framework. For this purpose, we will explore and document the scope of the changes in v7 and beyond of RxJS and plan an update strategy.

將 Angular 語言服務過渡到 Ivy

Transition the Angular language service to Ivy

該專案的目標是透過將語言服務過渡到 Ivy 來改善體驗並消除舊的依賴。目前,語言服務仍然使用 View Engine 的編譯器和型別檢查工具,即使對於 Ivy 應用也是如此。我們希望使用 Ivy 範本解析器和改進過的 Angular Language 服務型別檢查來適配應用的行為。這次遷移也是推進移除 View Engine 的一步,它可以簡化 Angular,減少 npm 的包大小,提高框架的可維護性。

The goal of this project is to improve the experience and remove legacy dependency by transitioning the language service to Ivy. Today the language service still uses the View Engine compiler and type checking, even for Ivy applications. We want to use the Ivy template parser and improved type checking for the Angular Language service to match application behavior. This migration will also be a step towards unblocking the removal of View Engine, which will simplify Angular, reduce the npm package size, and improve the framework's maintainability.

使用 Angular 中的原生可信型別提高安全性

Increased security with native Trusted Types in Angular

我們正在與 Google 的安全團隊合作,為新的可信任型別(Trusted Types) API 新增支援。這個網路平臺 API 將幫助開發人員建構更安全的 Web 應用。

In collaboration with Google's security team, we're adding support for the new Trusted Types API. This web platform API will help developers build more secure web applications.

透過整合 MDC Web改進 Angular Material 元件

Enhanced Angular Material components by integrating MDC Web

MDC Web 是由 Google 的 Material Design 團隊建立的函式庫,它為建構 Material Design 元件提供了可複用的原語。 Angular 團隊正在把這些原語融入 Angular Material 中。使用 MDC Web 可以讓 Angular Material 與 Material Design 規範更緊密地對齊,提升無障礙性,提高元件的品質,並提高我們團隊的開發速度。

MDC Web is a library created by Google's Material Design team that provides reusable primitives for building Material Design components. The Angular team is incorporating these primitives into Angular Material. Using MDC Web will align Angular Material more closely with the Material Design specification, expand accessibility, improve component quality, and improve our team's velocity.

為 Google 工程師提供更好的與 Angular 和 Google 內部伺服器端堆疊整合方式

Offer Google engineers better integration with Angular and Google's internal server stack

這是一個內部專案,它為 Angular 前端添加了對 Google 內部整合伺服器端堆疊的支援。

This is an internal project to add support for Angular front-ends to Google's internal integrated server stack.

使用統一的 Angular 版本控制和分支策略來簡化版本發佈

Streamline releases with consolidated Angular versioning & branching

我們希望在 Angular 的多個 GitHub 儲存庫( angular/angularangular/angular-cliangular/components )之間整合發佈管理工具。這項工作將使我們能夠複用基礎架構,統一和簡化流程,並提高發布流程的可靠性。

We want to consolidate release management tooling between Angular's multiple GitHub repositories (angular/angular, angular/angular-cli, and angular/components). This effort will allow us to reuse infrastructure, unify and simplify processes, and improve our release process's reliability.

在 Angular CLI 中使用 webpack 5 來優化建構速度和發佈套件體積

Optimized build speed and bundle sizes with Angular CLI webpack 5

作為 v11 發行版的一部分,我們在 Angular CLI 中引入了 webpack 5 的可選預覽版。為了確保穩定性,我們將繼續迭代這些實現,以提高建構速度和包大小。

As part of the v11 release, we introduced an opt-in preview of webpack 5 in the Angular CLI. To ensure stability, we’ll continue iterating on the implementation to enable build speed and bundle size improvements.

對提交資訊進行標準化,以提高開發人員的一致性

Higher developer consistency with commit message standardization

我們希望統一 Angular 儲存函式庫中的對提交資訊的要求和一致性( angular/angularangular/componentsangular/angular-cli ),以便為我們的開發過程帶來一致性,並推進基礎設施工具的複用。

We want to unify commit message requirements and conformance across Angular repositories (angular/angular, angular/components, angular/angular-cli) to bring consistency to our development process and reuse infrastructure tooling.

利用 Angular DevTools 加速除錯和效能分析

Accelerated debugging and performance profiling with Angular DevTools

我們正致力於增強 Angular 的開發工具,它將為除錯和效能分析提供實用工具。該專案旨在幫助開發人員理解 Angular 應用中的元件結構和變更檢測。

We are working on development tooling for Angular that will provide utilities for debugging and performance profiling. This project aims to help developers understand the component structure and the change detection in an Angular application.

利用新的入門文件改進開發人員的入門培訓

Improved developer onboarding with refreshed introductory documentation

我們將重新定義使用者的學習之旅,並重新整理入門文件。我們將清楚地說明 Angular 的優點、告訴你如何探索它的功能並提供一些指導,以便開發人員能夠在儘可能短的時間內熟練掌握該框架。

We will redefine the user learning journeys and refresh the introductory documentation. We will clearly state the benefits of Angular, how to explore its capabilities and provide guidance so developers can become proficient with the framework in as little time as possible.

未來

Future

透過為 @angular/forms 實現嚴格型別化來提升開發效率

Better developer ergonomics with strict typing for @angular/forms

我們將努力為響應式表單實現更嚴格的型別檢查。這樣,我們就可以讓開發人員在開發期間捕獲更多的問題,提供更好的文字編輯器和 IDE 支援,並改進對響應式表單的型別檢查。

We will work on implementing stricter type checking for reactive forms. This way, we will allow developers to catch more issues during development time, enable better text editor and IDE support, and improve the type checking for reactive forms.

提升無 Zone.js 方案的完整框架能力

Leverage full framework capabilities with Zone.js opt-out

我們將設計並實現一個讓 Angular 應用中的 Zone.js 變成可選項的計劃。這樣,我們就可以簡化框架,改進除錯,減少應用套件的大小。這將使我們能夠利用原生的 async / await 語法,這是目前的 Zone.js 方案無法支援的。

We are going to design and implement a plan to make Zone.js optional from Angular applications. This way, we will simplify the framework, improve debugging, and reduce application bundle size. Additionally, this will allow us to take advantage of native async/await syntax, which currently Zone.js does not support.

移除舊版 View Engine 以減少框架開銷

Reduce framework overhead by removing legacy View Engine

把所有內部工具都轉換成 Ivy 之後,我們希望刪除舊版的 View Engine,以減少 Angular 的概念負擔,縮小封裝尺寸,降低維護成本,降低程式碼函式庫的複雜性。

After the transition of all our internal tooling to Ivy has completed, we want to remove the legacy View Engine for smaller Angular conceptual overhead, smaller package size, lower maintenance cost, and lower complexity of the codebase.

將測試環境拆除工作自動化,以縮短測試和除錯時間

Improved test times and debugging with automatic test environment tear down

為了改善測試時間並在各個測試之中實現更好的隔離,我們希望 TestBed 自動清理並拆除測試環境。

To improve test time and create better isolation across tests, we want to change TestBed to automatically clean up and tear down the test environment after each test run.

將 ngc 作為 tsc 的外掛,以提高建構效能

Improved build performance with ngc as a tsc plugin distribution

將 Angular 編譯器作為 TypeScript 編譯器的外掛進行發佈,可以大大提高開發人員的建構效能,降低維護成本。

Distributing the Angular compiler as a plugin of the TypeScript compiler will substantially improve developers' build performance and reduce maintenance costs.

支援向宿主元素新增指令

Support adding directives to host elements

一項由來已久的特性請求是增加為宿主元素新增指令的能力。該特性允許開發人員使用額外的行為來擴充套件自己的元件,而不必使用繼承。該專案在定義 API、語義和實現方面都需要付出巨大的努力。

A long-standing feature request is to add the ability to add directives to host elements. The feature will allow developers to augment their own components with additional behaviors without using inheritance. The project will require substantial effort in terms of the definition of APIs, semantics, and implementation.

透過可選 NgModule 來簡化 Angular 的心智模型

Simplified Angular mental model with optional NgModules

為了簡化 Angular 的心智模型和學習之旅,我們將努力讓 NgModule 成為可選項。這項工作將允許開發人員開發獨立的元件,並實現另一種 API 來宣告元件的編譯範圍。

To simplify the Angular mental model and learning journey, we’ll be working on making NgModules optional. This work will allow developers to develop standalone components and implement an alternative API for declaring the component’s compilation scope.

更符合工效學的元件級程式碼分割 API

Ergonomic component level code-splitting APIs

Web 應用最常見的問題之一是它們的初始載入時間很慢。改進它的方式之一是在元件級別進行更精細的程式碼分割。為了鼓勵這種做法,我們將致力於設計更符合工效學的程式碼分割 API。

A common problem of web applications is their slow initial load time. A way to improve it is to apply more granular code-splitting on a component level. To encourage this practice, we’ll be working on more ergonomic code-splitting APIs.