写点什么

为什么说 Babel 将推动 JavaScript 的发展

  • 2015-05-26
  • 本文字数:1529 字

    阅读完需:约 5 分钟

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 读者交流群InfoQ 好读者)。

2015-05-26 09:2114482
用户头像

发布了 1008 篇内容, 共 399.0 次阅读, 收获喜欢 345 次。

关注

评论

发布
暂无评论
发现更多内容

屏幕适配插件:ScreenMatch基本使用和注意事项

Arch

关于PHP内存溢出的思考

L

php

PyFlink 社区扶持计划正式上线!

Apache Flink

大数据 flink 流计算 实时计算

祝贺!两位 Apache Flink PMC 喜提 Apache Member

Apache Flink

大数据 flink 流计算 实时计算

Flink 消息聚合处理方案

Apache Flink

大数据 flink 流计算 实时计算

哈希,茫茫人海,我一眼看到了你

dongge

什么是全光架构?光纤KVM和分布式IP KVM系统知多少?

DT极客

我入驻InfoQ平台啦

BlueblueWings

Flink SQL 的 9 个示例

Apache Flink

大数据 flink 流计算 实时计算

初文,大浪淘沙

傅丞 Tony

转任管理岗位后,还要不要从事编码工作?

MavenTalker

团队管理 程序员 个人成长 职业规划

原创 | OOAD范例:配置类设计

编程道与术

你的文章中为什么会有加粗的文字

小天同学

思考 写作 感悟

Iceberg 在基于 Flink 的流式数据入库场景中的应用

Apache Flink

大数据 flink 流计算 实时计算

Flink State 最佳实践

Apache Flink

大数据 flink AI 流计算 实时计算

Flink 的经典场景和业务故事有哪些?看看他们就知道了

Apache Flink

大数据 flink 流计算 实时计算

技术人员能力养成手记

MavenTalker

个人成长 程序人生 职业规划

docker搭建lamp

刘磐石(刘坤鹏)

在InfoQ开启写作之旅

张先亮-Hank

人工智能 随笔

最佳实践 | Flink Forward 全球会议抢先看!

Apache Flink

大数据 flink AI 流计算 实时计算

LeetCode 120. Triangle

隔壁小王

算法 LeetCode

Java 代码的组织机制

michaelliu

Java

Java 类构造函数的调用顺序

michaelliu

Java

经验可能反而阻碍你的新认知

孙苏勇

思考 读书

vue项目中遇到的依赖及其他问题

靖仙

Vue 大前端 Web

原创 | DDD与分层

编程道与术

Java 类

michaelliu

Java

工厂模式

Wen Wei

设计模式

作为程序员,有哪些写作平台值得推荐 ?B站也算吧

邓瑞恒Ryan

学习 创业 写作 知识管理 自我提升

18个PPT,29个提问解答,都在这儿啦!

Apache Flink

大数据 flink 流计算 实时计算

聊聊技术人如何与甲方客户打交道

MavenTalker

程序员 程序人生 职业规划

为什么说Babel将推动JavaScript的发展_JavaScript_谢丽_InfoQ精选文章