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

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