標籤：

【SNF-O】Angular 增加了 AOT Online Editor 的支持

01-31

類別

新增功能／Splendid New Feature

置信度

Observation

起始時間

2017-09-11

內容

在線編輯器對於 code demo 或者 issue reporting 而言是十分重要的功能。

對於 Angular 而言，在線編輯功能主要使用 Plunker 完成（新的 StackBlitz 也提供了較為全面的支持），所有 angular.io 中用到的代碼實例都會在發布時自動構建成對應的 Plunker 版本（以及相應的 zip 版本），同時 Plunker 上的復現也是對 Angular 中提 Bug Report 所需的要求。

不過由於 Plunker 上目前只能以 JIT 的方式構建 Angular 項目，無法展現出 AOT 特有的問題所在，所以導致了對於 AOT 的問題仍然需要手動建立項目重現，提升了不必要的維護成本。

Angular 團隊最近推出了新的支持 AOT 編譯的 Online Editor（的早期實驗版本），位於 edit.ng，能夠在瀏覽器中以 AOT 方式編譯項目，並能夠提供相應的報錯信息。

項目地址位於 adeora/playground，項目基於 Angular 實現，編輯器部分藉助於 monaco 的支持，編譯過程在 Web Worker 中完成，不會造成頁面卡頓。當前僅為早期版本，還有很多不完善的地方。

注1：Angular 中 AOT 和 JIT 的區分是編譯過程發生在應用啟動前或應用啟動過程中。

注2：在瀏覽器中進行 AOT 的性能可能比在瀏覽器中進行 JIT 更低。

相關鏈接

  • Edit.ng 在線編輯器：edit.ng
  • Edit.ng 的 Github Repo：adeora/playground
  • Monaco 的 Github Repo：Microsoft/monaco-editor
  • Angular Weekly Meeting Notes：docs.google.com/documen

推薦閱讀：

TAG:Angular? |