Angular2中的AoT（或Ahead-of-Time编译）是什么？

Question

Ahead-of-Time Compilation （或AoT）是Angular2中提供的一项功能。但我在官方网站上找不到关于它的好解释。

有人可以明确定义吗？

Answer 1

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

对于及时编译（常规行为），框架需要发布角度编译器，并在应用程序启动时在浏览器上编译模板。这意味着必须发送更高的包大小角度，以及更长的加载时间，因为浏览器必须先编译模板才能呈现它。

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

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

• 较小的捆绑包大小：angular2库的60％是编译器。既然提前编译了模板，我们就不需要再运送编译器了。这减少了应用程序需要发布的捆绑包大小
• 更快的加载时间：由于模板已经编译为VM友好代码，浏览器会花时间渲染模板。结果是更快的页面渲染。

Answer 2

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.