JavaScript 编译器 Prepack:旨在减少启动时间

  • David Iffland
  • 薛命灯

2017 年 5 月 11 日

话题:JavaScript语言 & 开发

紧跟前端发展,共享一线技术——推荐关注 InfoQ 垂直公众号前端之巅

Facebook 透露了一个项目,旨在“让 JavaScript 运行得更快”,只要 JavaScript 代码是在 React Native 应用里进行初始化的。

这个被称为Prepack的工具,试图移除编译时的计算过程,特别是在代码初始化阶段所进行的计算。随着 JavaScript 引擎的日渐成熟,现今最大的性能问题是如何改进用户体验。在很多移动应用里,本地代码比起 JavaScript 代码具有与生俱来的优势,比如那些 React Native 应用。因此,对于 React Native 应用来说,减少启动时间可以显著地改进用户体验。Nikolai Tillmann在 2016 年 9 月份加入 Facebook,专门解决这方面的问题。

项目主页上的所有示例都展示了如何进行全局处理,以便减少启动时间,避免客户端 JavaScript 引擎每次都要进行不必要的编译。Prepack 是一个“纯净的 JavaScript 参考实现”,所以它只读取必要的 JavaScript 代码。

现在,这个项目专注于如何为 React Native 改进初始化性能,因为 React Native 应用的启动过程相对耗时。设备端的 JavaScript 引擎编译次数越少,性能就越好。不过,这个项目无法感知它所运行的环境。Prepack 的文档里提到,“Prepack 并不知道 document 和 window 是什么。事实上,在 Prepack 里引用这些属性时,它们会得到 undefined”。

官方已经非常清楚地声明,该项目“还没有为生产做好准备”。在短时间内,主要的目标是能够把它应用于 React Native 应用,以及相关的工具链。对 Web 和 Node.js 的支持被列为“中期”目标,所以想要将该工具集成到 Web 应用里的开发者们需要等待一段时间。不过,虽然减小应用文件大小是 Web 开发者的关注点,但它并不是 Prepack 的目标。项目主页的底部有一段说明:

Prepack 关注运行时性能,而 Closure 编译器更注重 JavaScript 代码的大小。

Tillmann 写到,这个工具是否能够带来好处,完全取决于被编译的东西:

Prepack 可以作为传统编译器的补充。它的长处在于,它了解 JavaScript 内建组件,并在编译时期使用它们对代码进行预处理。在极端情况下,整个程序可以被缩减到只剩最终的结果。为了看到实际的效果,我们需要在一个能够缓存解析的环境里使用它。在初始化阶段,我们可以看到它带来最多 10 倍的执行时间改进。

查看英文原文: Prepack JavaScript Compiler Aims to Reduce Startup Time

JavaScript语言 & 开发