?

　　最近，Facebook 發(fā)布?Prepack?:一個優(yōu)化 JavaScript 源代碼的工具，實際上它是一個 JavaScript 部分求值器(Partvaluator)，可在編譯時執(zhí)行原本在運行時的計算過程，并通過重寫 JavaScript 代碼來提高其執(zhí)行效率。(西安尚學堂）

　　Prepack 用簡單的賦值序列來等效替換 JavaScript 代碼包中的全局代碼，從而消除了中間計算過程以及對象分配的操作。對于重初始化的代碼，Prepack可以有效緩存JavaScript解析的結果，優(yōu)化效果最佳。

?

　　下面五個概念可以幫我們更好的理解 Prepack 運行機制：

　　抽象語法樹(AST)Prepack運行在AST級別，使用Babel解析并生成JavaScript源代碼。

?

　　具體執(zhí)行(Concrete Execution)Prepack 核心是一個JavaScript解釋器，它與ECMAScript 5幾乎完全兼容，而且緊密地保持與ECMAScript 2016語言規(guī)范的一致性，你可以將Prepack中的解釋器視為完全參照JavaScript實現(xiàn)的。解釋器能夠跟蹤并撤銷包括所有對象Mutation在內的結果，從而能夠進行推測優(yōu)化(Speculative Optimization)。

?

　　符號執(zhí)行(Symbolic Execution)除了對具體值進行計算外，Prepack的解釋器還可以操作受環(huán)境相互作用影響的抽象值。例如Date.now可以返回一個抽象值，你可以通過helper輔助函數(shù)(如__abstract())手動注入抽象值。Prepack會跟蹤所有在抽象值上執(zhí)行的操作，在遇到分支時，Prepack會執(zhí)行并探索所有可能性。所以，Prepack實現(xiàn)了一套JavaScript的符號執(zhí)行引擎。

?

　　抽象釋義(Abstract Interpretation)符號執(zhí)行在遇到抽象值的分支時會分叉(fork)，Prepack會在控制流合并點加入分歧執(zhí)行(Diverged Execution)來實現(xiàn)抽象釋義的形式。連接變量和堆屬性可能會得到條件抽象值，Prepack會跟蹤有關抽象值和型域(Type Domain)的信息。

?

　　堆序列化(Heap Serialization)當全局代碼返回，初始化階段結束時，Prepack捕獲最終的堆并按順序排列堆棧，生成直觀的JavaScript新代碼，創(chuàng)建并鏈接初始化堆中可訪問的所有對象。堆中的一些值可能是抽象值的計算結果，對于這些值，Prepack將生成原始程序完成計算所執(zhí)行的代碼。

?

　　以下是官方提供的Prepack優(yōu)化示例：

　　

/* Hello World */// Input (function () {function hello() { return 'hello'; }function world() { return 'world'; }global.s = hello() + ' ' + world();})();// Output (function () {s = "hello world";})();/* 消除抽象稅 */// Input (function () {var self = this;['A', 'B', 42].forEach(function(x) {var name = '_' + x.toString()[0].toLowerCase();var y = parseInt(x);self[name] = y ? y : x;});})();// Output (function () {_a = "A";_b = "B";_4 = 42;})();

?

　　Prepack團隊對未來的規(guī)劃如下：

　　1、短期

　　穩(wěn)定現(xiàn)有功能集，用于預優(yōu)化(Prepack)React Native代碼包

　　集成React Native工具鏈

　　根據(jù)React Native所用模塊系統(tǒng)的假設來構建優(yōu)化

　　2、中期

　　進一步優(yōu)化序列化(Serialization)，包括：消除不暴露特性(identity)的對象;消除未使用的導出屬性，等等

　　預優(yōu)化每個函數(shù)、基本代碼塊、語句、表達式

　　與ES6保持完全一致

　　支持廣泛的模塊系統(tǒng)

　　假設ES6支持某些功能，延遲完成或直接忽略Polyfill應用

　　進一步實現(xiàn)Web和Node.js環(huán)境中的兼容性目標

　　深入集成JavaScript虛擬機，改進堆反序列化過程，包括 ：暴露“對象懶初始化”的概念 - 以一種JavaScript無感知的方式，在首次使用對象時對其進行初始化;通過專門的字節(jié)碼提高普通對象創(chuàng)建的編碼效率;將代碼分為兩個階段：1) 非環(huán)境依賴階段，虛擬機可以安全地捕獲并恢復生成的堆;2)環(huán)境依賴階段，通過從環(huán)境中獲得的值執(zhí)行所有剩余的計算過程來拼湊具體的堆，等等

　　總結循環(huán)和遞歸

　　3、長期 - 利用Prepack作為一個平臺

　　JavaScript Playground - 通過調整JavaScript引擎體驗JavaScript特性，這些引擎由JavaScript所編寫，托管在瀏覽器中;你可以把它想象成一個“Babel虛擬機”，實現(xiàn)了不能被編譯的JavaScript新特性

　　捕捉Bug - 發(fā)現(xiàn)異常崩潰、執(zhí)行問題……

　　效果分析，例如檢測模塊工廠函數(shù)可能的副作用或強制純凈注釋

轉載于:https://www.cnblogs.com/a31415926/p/6832199.html

總結

以上是生活随笔為你收集整理的JS代码优化工具Prepack的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。