转载

为什么Babel将推动JavaScript的发展

Babel 是一个转换编译器，它能将ES6转换成可以在浏览器中运行的代码。Babel由来自澳大利亚的开发者 Sebastian McKenzie 创建。他的目标是使Babel可以处理ES6的所有新语法，并为它内置了 React JSX扩展及 Flow 类型注解支持。

据 codemix 创始人 Charles Pick 介绍，Babel是所有ES6转换编译器中与ES6规范兼容度最高的，甚至超过了谷歌创建已久的 Traceur 编译器。Babel允许开发者使用ES6的所有新特性，而且不会影响与老版本浏览器的兼容性。此外，它还支持许多不同的构建&测试系统，使开发者很容易将它集成到自己的工具链中。

Charles认为，Babel从根本上讲是一个平台，这是它与compile-to-JS语言 CoffeeScript 和 TypeScript 最大的不同。Babel的插件系统允许开发者自定义代码转换器并插入到编译过程。这些转换器会接收一棵抽象语法树，并在代码转换成可执行的JavaScript之前对其进行操作。codemix已经尝试开发了静态&运行时类型检查、闭包消除、 JavaScript“健康宏（hygienic macros）” 等插件。

Babel不仅跟踪ES6的进展情况，而且还是ES7或ES2016的试验场。比如，它已经支持 async/await ，使开发者更容易编写异步JavaScript代码，而且与使用回调或Promises相比，代码更简洁易懂。虽然主流浏览器可能还需要几年的时间才能支持这种异步JavaScript代码编写方式，但Babel使开发者现在就可以用上它。这得益于Babel与JavaScript技术委员会（ TC39 ）保持着高度一致，能够在ECMAScript新特性标准化之前为开发者提供现实世界可用的实现。而同时，这也有利于JavaScript的进一步发展，因为其团队可以在ECMAScript规范最后定稿前就获得来自现实世界的反馈。

Babel还能提升JavaScript的执行速度。由于JavaScript文件加载和执行速度慢会严重影响用户体验，所以JIT没有时间在运行时执行所有技术上可行的优化。相比之下，Babel是在编译时运行，没有这么严格的时间限制。借助强大的作用域跟踪和类型推断功能及插件系统，开发者可以构建转换器来执行此类优化，比如上文提到的闭包消除可以将闭包转换成平常的函数。Babel本身也内置了一些优化，比如通过 utility.deadCodeElimination 转换器执行常量合并/常量传播。在接下来的几个月里，我们还有望看到如下插件：

任意函数内联：将函数内联至调用点，实现性能最大化，避免多态和函数调用开销；
函数复制：在JavaScript中，多态是导致代码执行慢的一个常见原因。因此，在函数无法内联的地方，应该生成一个函数副本，确保函数保持单态；
循环内不变代码外提：将循环体内不变的代码移至循环体外；
循环展开：如果循环次数N固定，则移除循环，将循环体复制N份。

codemix后续将发布多个执行此类优化的插件，感兴趣的读者可以联系他们或者关注其 Twitter 。关于JavaScript引擎可以做哪些不同的优化，可以查看这里。

Babel插件并局限于性能提升，比如，还可以做下面这些事情：

i18n/翻译转换器：翻译特定字符串并替换；
自定义日志系统：通过环境变量设置日志级别，控制日志粒度；
面向可选模板系统（如Mustache或Handlebars）的编译时转换器：将标签模板字符串直接转换成JavaScript代码；
文档生成器：利用Flow类型注解和类型推断生成文档。

上述插件，有一部分已经实现。

总之，Charles认为，Babel是一款优秀的软件，必将成为每个Web开发者工具箱的一部分，而作为ECMAScript的试验场，它在不远的将来很可能会成为推动ES6和ESNext应用和发展的主要动力。

感谢郭蕾对本文的审校。

给InfoQ中文站投稿或者参与内容翻译工作，请邮件至editors@cn.infoq.com。也欢迎大家通过新浪微博（@InfoQ，@丁晓昀），微信（微信号： InfoQChina ）关注我们，并与我们的编辑和其他读者朋友交流（欢迎加入InfoQ读者交流群为什么Babel将推动JavaScript的发展）。