7

提前编译（或 AoT）是 Angular2 中提供的一项功能。但是我在官方网站上找不到很好的解释。

有人可以给它一个明确的定义吗？

4

2 回答 2

8

我们使用 angular2 特殊语法（如ngFor管道或数据绑定的东西）的模板需要编译为浏览器可以读取的 vm 友好代码。

对于即时编译（常规行为），框架需要提供 Angular 编译器，并且模板会在应用程序启动时在浏览器上进行编译。这意味着更大的包大小 angular 必须发送，并且加载时间更长，因为浏览器必须在渲染模板之前编译模板。

这类似于我们在浏览器中转换打字稿的方式。因为这是一个昂贵的过程，我们通常在捆绑或构建过程时离线转换 typescript。

离线渲染模板几乎没有什么好处，比如

  • 更小的包大小：angular2 库的 60% 是编译器。现在模板已经提前编译好了，我们就不需要再发布编译器了。这减少了应用程序需要发送的捆绑包大小
  • 更快的加载时间：由于模板已经编译为 VM 友好代码，浏览器无需花费时间渲染模板。导致更快的页面渲染。
于 2016-09-14T11:05:08.097 回答
1

Angular2 文档： https ://angular.io/docs/ts/latest/guide/deployment.html#!#aot

Angular Ahead-of-Time 编译器在构建过程中预编译应用程序组件及其模板。

使用 AOT 编译的应用程序启动速度更快有几个原因。

Application components execute immediately, without client-side compilation.
Templates are embedded as code within their components so there is no client-side request for template files.
You don't download the Angular compiler, which is pretty big on its own.
The compiler discards unused Angular directives that a tree-shaking tool can then exclude.
于 2017-03-01T23:55:00.687 回答