Introducing new JavaScript optimizations, WebAssembly, SharedArrayBuffer, and Atomics in EdgeHTML 16
JavaScript 的表現(xiàn)一直是我們團(tuán)隊(duì)工作的目標(biāo)，在每一次的更新中，我們都試圖通過(guò)更短的啟動(dòng)時(shí)間、更快的運(yùn)行速度和更少的內(nèi)存占用，以此提升瀏覽器終端用戶的使用體驗(yàn)。這些努力是由寶貴的持續(xù)客戶反饋和測(cè)試數(shù)據(jù)做指導(dǎo)的。
在這篇文章中我們會(huì)分享一些 Chakra 引擎中的新功能，例如在新的 Windows 更新中將 WebAssembly、SharedArrayBuffer 和 Atomic 加入瀏覽器默認(rèn)支持（EdgeHTML 16）。
More memory savings from deferring/re-deferring functions
在 EdgeHTML 15 中，Chakra 引入了 re-defer functions 。這里簡(jiǎn)要回顧一下 Chakra 的 deferring/re-deferring 功能。在啟動(dòng)階段 Chakra 首先進(jìn)行一次快速的 pre-parse 過(guò)程來(lái)檢查語(yǔ)法錯(cuò)誤，然后在函數(shù)第一次運(yùn)行時(shí)才對(duì)函數(shù)的內(nèi)容進(jìn)行 full-parse ，隨后，如果通過(guò)啟發(fā)式判定認(rèn)為某個(gè)函數(shù)不會(huì)再被執(zhí)行了，那么 Chakra 會(huì)拋棄這個(gè)函數(shù)從 full-pasring 階段生成的數(shù)據(jù)，將函數(shù)恢復(fù)成剛剛 pre-parse
之后的狀態(tài)。
deferring/re-deferring 功能可以幫助瀏覽器快速的加載網(wǎng)頁(yè)，并且節(jié)省那些冗余函數(shù)占用的空間。
在 EdgeHTML 16 中，我們?cè)鰪?qiáng)了這部分的功能，將之前無(wú)法適用的 lexical scope 和 parameter scope 納入功能范圍，使得所有的函數(shù)都可以被 deferring/re-deferring 。舉例來(lái)說(shuō)，
// foo can be deferred/re-deferred after the Fall Creators Update
// example 1 - lexical/block scope
try {
function foo() {...}
var bar = foo();
}
// example 2 - parameter scope
function bar(foo = function(){...})) {...}
這些改變極大的增強(qiáng)了 deferring/re-deferring 的功能，進(jìn)一步減少了內(nèi)存使用量。根據(jù)我們的實(shí)驗(yàn)結(jié)果來(lái)看，這個(gè)功能減少了 Chakra 大約 4-9% 的內(nèi)存消耗，更有甚者，在 Gmail 中這個(gè)值達(dá)到了 35%。
Polymorphic inline cache for property access using square brackets (object[‘property’])
Polymorphic inline cache (PIC) 是 Chakra 一開(kāi)始就使用的一種優(yōu)化技術(shù)。Chakra 使用一種自定義的類型系統(tǒng)來(lái)將值與類型匹配起來(lái)。當(dāng) Chakra 的 JIT 引擎生成代碼時(shí)，Chakra 會(huì)在每一處調(diào)用階段都使用 inline cache 來(lái)記錄下這里所用到的類型，函數(shù)調(diào)用時(shí)便可以快速的匹配對(duì)象類型是否合法。
PIC 是一種可以記錄多種類型的 inline cache。在 EdgeHTML 16 中，Chakra 為 object[‘property’] 這種訪問(wèn)方式增加了 PIC 的支持，使得如下這種可能出現(xiàn)不同類型的訪問(wèn)情況可以被優(yōu)化
// example - obj can be of {a: Number} or String type
let arr = [{a: Math.random()}, Math.random().toString()];
arr.forEach(obj => {
for (propNames in obj) {
if (obj.hasOwnProperty(propNames)) {
// without PIC, multiple types lead to generic slow path
// with PIC, both types for obj
console.log(obj[propNames]);
}
}
});
Enable optimizations for functions with try/finally
在 JavaScript 中，使用 finallly 關(guān)鍵字可以優(yōu)雅的釋放 try 中使用的資源。但是直到上一次更新，Chakra 都無(wú)法優(yōu)化含有 try、finally 的函數(shù)，因?yàn)樵?JIT 優(yōu)化過(guò)程中考慮異常和展開(kāi)堆棧是一項(xiàng)復(fù)雜的工作。
從 Edgehtml 16 開(kāi)始，當(dāng) Chakra JIT 分析函數(shù)并構(gòu)建 cfg 時(shí)，它將異常和非異常的情況分開(kāi)考慮，并且為 try/finally 創(chuàng)建了兩條路徑，對(duì)沒(méi)有異常的情況進(jìn)行常規(guī)優(yōu)化，對(duì)產(chǎn)生異常的情況進(jìn)行 bailout。
接下來(lái)會(huì)有更多針對(duì) try/catch/finally 的優(yōu)化操作出現(xiàn)，ChakraCore 最近為含有這些關(guān)鍵字的函數(shù)內(nèi)聯(lián)添加了支持，你可以在下個(gè)版本的 Windows 更新中看到這些內(nèi)容
WebAssembly, SharedArrayBuffer, and Atomics on by default
在之前版本的更新中，Edge 已經(jīng)將 WebAssembly Minimum Viable Product (MVP), SharedArrayBuffer 和 Atomics 作為實(shí)驗(yàn)性功能添加進(jìn)來(lái)，經(jīng)過(guò)過(guò)去幾個(gè)月的微調(diào)，這些功能現(xiàn)在已經(jīng)穩(wěn)定并已經(jīng)作為默認(rèn)功能實(shí)現(xiàn)在了 Edgehtml 16 中。
Several changes 這些改變將 Wasm 在 Chakra 中的表現(xiàn)提升了大約 20-25% 。下面是一個(gè) Wasm 的鏈接 Funky Karts ，你可以親自實(shí)驗(yàn)一下 Wasm 在Edge 中的表現(xiàn)
MicroSoft 已經(jīng)并將繼續(xù)和 Mozilla、Google、Apple等各大瀏覽器廠商合作，完善 Wasm 技術(shù)。一些新的 Wasm 功能已經(jīng)出現(xiàn)在了 Wasm 的官方規(guī)范中，如threads 和GC
