ng-conf 2016大会深入介绍了新的Angular编译器

Angular JavaScript

摘要

ng-conf 2016大会第二天深入介绍了新的离线编译器，并部分地说明了Angular 2未来的发展方向。

正文

ng-conf 2016大会第二天以一场技术性很强的主题演讲拉开了序幕。Angular团队成员登台，深入介绍了Angular 2。

Rob Wormwold和Misko Hevery主要谈论了新的离线编译步骤。Wormwold展示了两种编译模式：动态和静态。动态模式就是Angular开发人员熟悉的模式。框架被发送到浏览器，所有的编译都是在那里进行的。在这种模式下，Angular净负荷大约为116K。

对于该离线静态编译器，有几个步骤可以将净负荷减小到49K（最终应该是45K）。

Hevery列举了新编译器的其中几个好处：

由于我们已经使用JavaScript重写了解析器，所以我们可以让它对大小写敏感。这就是为什么，在Angular 2中，你不必使用ng-if，只需使用ngIf。我们还可以提供行号。我们知道特定的标记或控制器来自哪里。如果有异常，我们可以给出行号和列号。

这个新的编译系统仅使用了JavaScript，没有任何DOM依赖，因此，它可以在任何地方运行，包括浏览器、服务器和其他任何运行JavaScript的地方。Hevery表示，由于新编译器生成的代码是“单体的（monomorphic）”，所以浏览器VM可以内联函数调用点，“极大地提升速度”。

新编译管道由以下四个步骤组成：

• 编译
• 内联
• Tree-Shake
• “最小化（Minify）”

编译和最小化是这样一个过程里的典型步骤，但内联和tree-shaking是新增的步骤。内联会将所有导出和导入的各种模块合并到一个文件中。它不是简单的串联。Hevery说，“我们说的是取得各个符号，然后将它们放在一起”。

目前，Tree-shaking步骤使用了一个名为RollUp的工具，检查那个仅有的文件，剔除永远用不到的代码。这极大地较少了程序包中的代码量，因为除了其他原因外，Angular编译器本身固有的东西也会被移除。Hevery说道：

Tree shaker会跟踪[代码]，只保留确实存在引用的符号。因为我们使用了[离线编译器]，没有引用ng编译器，所以它会被自动排除出去。实际上，我们还可以排除其他东西。如果你没有在应用程序中使用ngFor或ngIf，那么我们也可以不包含它。我们只包含这个应用程序真正需要的东西。

从版本1到版本2，Angular完全重写了，这给社区带来了许多痛苦，Angular团队希望那种情况永远不再出现。Alex Eagle上台谈了谷歌内部使用的重构工具，该工具可以保证其应用随Angular本身的变化而升级。他们希望向社区提供类似的东西。Eagle说道：

我们可能保证Angular长盛不衰吗？通过及时更新框架以及让所有用户和我们保持同步，我们可以避免与“Angular 3”打交道吗？

该工具使用了TypeScript语言服务、新编译器和解析器为应用的TypeScript和HTML/CSS文件创建“源码修订建议”。Eagle说，“那些修订足以纠正我们眼下在框架中造成的破坏”。为此，Angular团队宣布，他们“计划构建”一套公共的工具，对于框架中的每一项破坏性变化，“一整套的升级选项可以帮你从现在正在使用的任何版本升级到最新版本。”

感兴趣的读者可以在YouTube上观看ng-conf 2016大会第二天主题演讲的完整视频。

查看英文原文：Deep Dive Into New Angular Compiler at ng-conf 2016