[关闭]
@lenville 2017-05-04T14:07:12.000000Z 字数 3431 阅读 643

Facebook开源JavaScript代码优化工具Prepack

Facebook JavaScript Prepack

5月4日，Facebook开源团队技术作者Joel Marcey在Hacker News社区发布一则《Prepack帮助提高JavaScript代码的效率》，引起了社区的广泛讨论。

官方宣称Prepack是一个优化JavaScript源代码的工具，实际上它是一个JavaScript的部分求值器（Partial Evaluator），可在编译时执行原本在运行时的计算过程，并通过重写JavaScript代码来提高其执行效率。Prepack用简单的赋值序列来等效替换JavaScript代码包中的全局代码，从而消除了中间计算过程以及对象分配的操作。对于重初始化的代码，Prepack可以有效缓存JavaScript解析的结果，优化效果最佳。

以下五个概念可以帮助你更好地理解Prepack的运行机制：

以下是官方提供的Prepack优化示例：

  1. /* Hello World */
  3. // Input
  4. (function () {
  5.   function hello() { return 'hello'; }
  6.   function world() { return 'world'; }
  7.   global.s = hello() + ' ' + world();
  8. })();
  10. // Output
  11. (function () {
  12.   s = "hello world";
  13. })();
  1. /* 消除抽象税 */
  3. // Input
  4. (function () {
  5.   var self = this;
  6.   ['A', 'B', 42].forEach(function(x) {
  7.     var name = '_' + x.toString()[0].toLowerCase();
  8.     var y = parseInt(x);
  9.     self[name] = y ? y : x;
  10.   });
  11. })();
  13. // Output
  14. (function () {
  15.   _a = "A";
  16.   _b = "B";
  17.   _4 = 42;
  18. })();
  1. /* 斐波那契 */
  3. // Input
  4. (function () {
  5.   function fibonacci(x) {
  6.     return x <= 1 ? x : fibonacci(x - 1) + fibonacci(x - 2);
  7.   }
  8.   global.x = fibonacci(23);
  9. })();
  11. // Output
  12. (function () {
  13.   x = 28657;
  14. })();
  1. /* 模块初始化 */
  3. // Input
  4. (function () {
  5.   let moduleTable = {};
  6.   function define(id, f) { moduleTable[id] = f; }
  7.   function require(id) {
  8.     let x = moduleTable[id];
  9.     return x instanceof Function ? (moduleTable[id] = x()) : x;
  10.   }
  11.   global.require = require;
  12.   define("one", function() { return 1; });
  13.   define("two", function() { return require("one") + require("one"); });
  14.   define("three", function() { return require("two") + require("one"); });
  15.   define("four", function() { return require("three") + require("one"); });
  16. })();
  17. three = require("three");
  19. // Output
  20. (function () {
  21.   function _2() {
  22.     return 3 + 1;
  23.   }
  25.   var _1 = {
  26.     one: 1,
  27.     two: 2,
  28.     three: 3,
  29.     four: _2
  30.   };
  32.   function _0(id) {
  33.     let x = _1[id];
  34.     return x instanceof Function ? _1[id] = x() : x;
  35.   }
  37.   require = _0;
  38.   three = 3;
  39. })();
  1. /* 环境相互作用与分支 */
  3. // Input
  4. (function(){
  5.   function fib(x) { return x <= 1 ? x : fib(x - 1) + fib(x - 2); }
  6.   let x = Date.now();
  7.   if (x === 0) x = fib(10);
  8.   global.result = x;
  9. })();
  11. // Output
  12. (function () {
  13.   var _0 = Date.now();
  14.   if (typeof _0 !== "number") {
  15.     throw new Error("Prepack model invariant violation");
  16.   }
  17.   result = _0 === 0 ? 55 : _0;
  18. })();

目前Prepack仍处于早期开发阶段，尚未准备好在生产环境中使用，官方建议仅尝试使用，并欢迎提供反馈以帮助修复错误。

以下是Prepack团队对未来的规划：

添加新批注
在作者公开此批注前，只有你和作者可见。
回复批注