前言
JAVAScript絕對(duì)是最火的編程語言之一,一直具有很大的用戶群,隨著在服務(wù)端的使用(NodeJs),更是爆發(fā)了極強(qiáng)的生命力。編程語言分為編譯型語言和解釋型語言兩類,編譯型語言在執(zhí)行之前要先進(jìn)行完全編譯,而解釋型語言一邊編譯一邊執(zhí)行,很明顯解釋型語言的執(zhí)行速度是慢于編譯型語言的,而JavaScript就是一種解釋型腳本語言,支持動(dòng)態(tài)類型、弱類型、基于原型的語言,內(nèi)置支持類型。鑒于JavaScript都是在前端執(zhí)行,而且需要及時(shí)響應(yīng)用戶,這就要求JavaScript可以快速的解析及執(zhí)行。
隨著Web相關(guān)技術(shù)的發(fā)展,JavaScript所要承擔(dān)的工作也越來越多,早就超越了“表單驗(yàn)證”的范疇,這就更需要快速的解析和執(zhí)行JavaScript腳本。V8引擎就是為解決這一問題而生,在node中也是采用該引擎來解析JavaScript。
V8是如何使得JavaScript性能有大幅提升的呢?通過對(duì)一些書籍和文章的學(xué)習(xí),梳理了V8的相關(guān)內(nèi)容,本文將帶你認(rèn)識(shí) V8。(該文在 17 年整理后發(fā)布到知乎,也被知乎編輯進(jìn)行了推薦,現(xiàn)在也同步到頭條號(hào)上,希望幫助更多的人了解 V8 引擎。)
1.渲染引擎及網(wǎng)頁(yè)渲染
瀏覽器自從上世紀(jì)80年代后期90年代初期誕生以來,已經(jīng)得到了長(zhǎng)足的發(fā)展,其功能也越來越豐富,包括網(wǎng)絡(luò)、資源管理、網(wǎng)頁(yè)瀏覽、多頁(yè)面管理、插件和擴(kuò)展、書簽管理、歷史記錄管理、設(shè)置管理、下載管理、賬戶和同步、安全機(jī)制、隱私管理、外觀主題、開發(fā)者工具等。在這些功能中,為用戶提供網(wǎng)頁(yè)瀏覽服務(wù)無疑是最重要的功能,下面將對(duì)相關(guān)內(nèi)容進(jìn)行介紹。
1.1.渲染引擎
渲染引擎:能夠?qū)tml/css/JavaScript文本及相應(yīng)的資源文件轉(zhuǎn)換成圖像結(jié)果。渲染引擎的主要作用是將資源文件轉(zhuǎn)化為用戶可見的結(jié)果。在瀏覽器的發(fā)展過程中,不同的廠商開發(fā)了不同的渲染引擎,如Tridend(IE)、Gecko(FF)、WebKit(Safari,Chrome,Andriod瀏覽器)等。WebKit是由蘋果2005年發(fā)起的一個(gè)開源項(xiàng)目,引起了眾多公司的重視,幾年間被很多公司所采用,在移動(dòng)端更占據(jù)了壟斷地位。更有甚者,開發(fā)出了基于WebKit的支持HTML5的web操作系統(tǒng)(如:Chrome OS、Web OS)。
下面是WebKit的大致結(jié)構(gòu):

webkit架構(gòu)圖
上圖中實(shí)線框內(nèi)模塊是所有移植的共有部分,虛線框內(nèi)不同的廠商可以自己實(shí)現(xiàn)。下面進(jìn)行介紹:
- 操作系統(tǒng):是管理和控制計(jì)算機(jī)硬件與軟件資源的計(jì)算機(jī)程序,是直接運(yùn)行在“裸機(jī)”上的最基本的系統(tǒng)軟件,任何其他軟件都必須在操作系統(tǒng)的支持下才能運(yùn)行。WebKit也是在操作系統(tǒng)上工作的。
- 第三方庫(kù),為了WebKit提供支持,如圖形庫(kù)、網(wǎng)絡(luò)庫(kù)、視頻庫(kù)等。
- WebCore 是各個(gè)瀏覽器使用的共享部分,包括HTML解析器、CSS解析器、DOM和SVG等。JavaScriptCore是WebKit的默認(rèn)引擎,在谷歌系列產(chǎn)品中被替換為V8引擎。WebKit Ports是WebKit中的非共享部分,由于平臺(tái)差異、第三方庫(kù)和需求的不同等原因,不同的移植導(dǎo)致了WebKit不同版本行為不一致,它是不同瀏覽器性能和功能差異的關(guān)鍵部分。
- WebKit嵌入式編程接口,供瀏覽器調(diào)用,與移植密切相關(guān),不同的移植有不同的接口規(guī)范。
- 測(cè)試用例,包括布局測(cè)試用例和性能測(cè)試用例,用來驗(yàn)證渲染結(jié)果的正確性。
1.2.網(wǎng)頁(yè)渲染流程
上面介紹了渲染引擎的各個(gè)模塊,那么一張網(wǎng)頁(yè),要經(jīng)歷怎樣的過程,才能抵達(dá)用戶面前?

渲染流程
首先是網(wǎng)頁(yè)內(nèi)容,輸入到HTML解析器,HTML解析器解析,然后構(gòu)建DOM樹,在這期間如果遇到JavaScript代碼則交給JavaScript引擎處理;如果來自CSS解析器的樣式信息,構(gòu)建一個(gè)內(nèi)部繪圖模型。該模型由布局模塊計(jì)算模型內(nèi)部各個(gè)元素的位置和大小信息,最后由繪圖模塊完成從該模型到圖像的繪制。在網(wǎng)頁(yè)渲染的過程中,大致可分為下面3個(gè)階段。
1.2.1.從輸入U(xiǎn)RL到生成DOM樹
- 地址欄輸入U(xiǎn)RL,WebKit調(diào)用資源加載器加載相應(yīng)資源;
- 加載器依賴網(wǎng)絡(luò)模塊建立連接,發(fā)送請(qǐng)求并接收答復(fù);
- WebKit接收各種網(wǎng)頁(yè)或者資源數(shù)據(jù),其中某些資源可能同步或異步獲取;
- 網(wǎng)頁(yè)交給HTML解析器轉(zhuǎn)變?yōu)樵~語;
- 解釋器根據(jù)詞語構(gòu)建節(jié)點(diǎn),形成DOM樹;
- 如果節(jié)點(diǎn)是JavaScript代碼,調(diào)用JavaScript引擎解釋并執(zhí)行;
- JavaScript代碼可能會(huì)修改DOM樹結(jié)構(gòu);
- 如果節(jié)點(diǎn)依賴其他資源,如圖片css、視頻等,調(diào)用資源加載器加載它們,但這些是異步加載的,不會(huì)阻礙當(dāng)前DOM樹繼續(xù)創(chuàng)建;如果是JavaScript資源URL(沒有標(biāo)記異步方式),則需要停止當(dāng)前DOM樹創(chuàng)建,直到JavaScript加載并被JavaScript引擎執(zhí)行后才繼續(xù)DOM樹的創(chuàng)建。
1.2.2.從DOM樹到構(gòu)建WebKit繪圖上下文
- CSS文件被CSS解釋器解釋成內(nèi)部表示;
- CSS解釋器完成工作后,在DOM樹上附加樣式信息,生成RenderObject樹;
- RenderObject節(jié)點(diǎn)在創(chuàng)建的同時(shí),WebKit會(huì)根據(jù)網(wǎng)頁(yè)層次結(jié)構(gòu)構(gòu)建RenderLayer樹,同時(shí)構(gòu)建一個(gè)虛擬繪圖上下文。
1.2.3.繪圖上下文到最終圖像呈現(xiàn)
- 繪圖上下文是一個(gè)與平臺(tái)無關(guān)的抽象類,它將每個(gè)繪圖操作橋接到不同的具體實(shí)現(xiàn)類,也就是繪圖具體實(shí)現(xiàn)類;
- 繪圖實(shí)現(xiàn)類也可能有簡(jiǎn)單的實(shí)現(xiàn),也可能有復(fù)雜的實(shí)現(xiàn),軟件渲染、硬件渲染、合成渲染等;
- 繪圖實(shí)現(xiàn)類將2D圖形庫(kù)或者3D圖形庫(kù)繪制結(jié)果保存,交給瀏覽器界面進(jìn)行展示。
上述是一個(gè)完整的渲染過程,現(xiàn)代網(wǎng)頁(yè)很多都是動(dòng)態(tài)的,隨著網(wǎng)頁(yè)與用戶的交互,瀏覽器需要不斷的重復(fù)渲染過程。
1.3.JavaScript引擎

引擎執(zhí)行流程
JavaScript本質(zhì)上是一種解釋型語言,與編譯型語言不同的是它需要一邊執(zhí)行一邊解析,而編譯型語言在執(zhí)行時(shí)已經(jīng)完成編譯,可直接執(zhí)行,有更快的執(zhí)行速度(如上圖所示)。JavaScript代碼是在瀏覽器端解析和執(zhí)行的,如果需要時(shí)間太長(zhǎng),會(huì)影響用戶體驗(yàn)。那么提高JavaScript的解析速度就是當(dāng)務(wù)之急。JavaScript引擎和渲染引擎的關(guān)系如下圖所示:

JS引擎與渲染引擎的關(guān)系
JavaScript語言是解釋型語言,為了提高性能,引入了Java虛擬機(jī)和C++編譯器中的眾多技術(shù)。現(xiàn)在JavaScript引擎的執(zhí)行過程大致是:
源代碼-→抽象語法樹-→字節(jié)碼-→JIT-→本地代碼(V8引擎沒有中間字節(jié)碼)。一段代碼的抽象語法樹示例如下:
function demo(name) {
console.log(name);
}
抽象語法樹如下:

抽象語法樹
V8更加直接的將抽象語法樹通過JIT技術(shù)轉(zhuǎn)換成本地代碼,放棄了在字節(jié)碼階段可以進(jìn)行的一些性能優(yōu)化,但保證了執(zhí)行速度。在V8生成本地代碼后,也會(huì)通過Profiler采集一些信息,來優(yōu)化本地代碼。雖然,少了生成字節(jié)碼這一階段的性能優(yōu)化,但極大減少了轉(zhuǎn)換時(shí)間。
但是在2017年4月底,v8 的 5.9 版本發(fā)布了,新增了一個(gè) Ignition 字節(jié)碼解釋器,將默認(rèn)啟動(dòng),從此之后將與JSCore有大致相同的流程。做出這一改變的原因?yàn)椋海ㄖ饕獎(jiǎng)訖C(jī))減輕機(jī)器碼占用的內(nèi)存空間,即犧牲時(shí)間換空間;提高代碼的啟動(dòng)速度;對(duì) v8 的代碼進(jìn)行重構(gòu),降低 v8 的代碼復(fù)雜度(V8 Ignition:JS 引擎與字節(jié)碼的不解之緣 - CNode技術(shù)社區(qū))。
JavaScript的性能和C相比還有不小的距離,可預(yù)見的未來估計(jì)也只能接近它,而不是與它相比,這從語言類型上已經(jīng)決定。下面將對(duì)V8引擎進(jìn)行更為細(xì)致的介紹。
2.V8引擎
V8引擎是一個(gè)JavaScript引擎實(shí)現(xiàn),最初由一些語言方面專家設(shè)計(jì),后被谷歌收購(gòu),隨后谷歌對(duì)其進(jìn)行了開源。V8使用C++開發(fā),,在運(yùn)行JavaScript之前,相比其它的JavaScript的引擎轉(zhuǎn)換成字節(jié)碼或解釋執(zhí)行,V8將其編譯成原生機(jī)器碼(IA-32, x86-64, ARM, or MIPS CPUs),并且使用了如內(nèi)聯(lián)緩存(inline caching)等方法來提高性能。有了這些功能,JavaScript程序在V8引擎下的運(yùn)行速度媲美二進(jìn)制程序。V8支持眾多操作系統(tǒng),如windows、linux、Android等,也支持其他硬件架構(gòu),如IA32,X64,ARM等,具有很好的可移植和跨平臺(tái)特性。 V8項(xiàng)目代碼結(jié)構(gòu)如下:

代碼結(jié)構(gòu)
2.1.數(shù)據(jù)表示
JavaScript是一種動(dòng)態(tài)類型語言,在編譯時(shí)并不能準(zhǔn)確知道變量的類型,只可以在運(yùn)行時(shí)確定,這就不像c++或者java等靜態(tài)類型語言,在編譯時(shí)候就可以確切知道變量的類型。然而,在運(yùn)行時(shí)計(jì)算和決定類型,會(huì)嚴(yán)重影響語言性能,這也就是JavaScript運(yùn)行效率比C++或者JAVA低很多的原因之一。
在C++中,源代碼需要經(jīng)過編譯才能執(zhí)行,在生成本地代碼的過程中,變量的地址和類型已經(jīng)確定,運(yùn)行本地代碼時(shí)利用數(shù)組和位移就可以存取變量和方法的地址,不需要再進(jìn)行額外的查找,幾個(gè)機(jī)器指令即可完成,節(jié)省了確定類型和地址的時(shí)間。由于JavaScript是無類型語言,那就不能像c++那樣在執(zhí)行時(shí)已經(jīng)知道變量的類型和地址,需要臨時(shí)確定。JavaScript 和C++有以下幾個(gè)區(qū)別:
- 編譯確定位置,C++編譯階段確定位置偏移信息,在執(zhí)行時(shí)直接存取,JavaScript在執(zhí)行階段確定,而且執(zhí)行期間可以修改對(duì)象屬性;
- 偏移信息共享,C++有類型定義,執(zhí)行時(shí)不能動(dòng)態(tài)改變,可共享偏移信息,JavaScript每個(gè)對(duì)象都是自描述,屬性和位置偏移信息都包含在自身的結(jié)構(gòu)中;
- 偏移信息查找,C++查找偏移地址很簡(jiǎn)單,在編譯代碼階段,對(duì)使用的某類型成員變量直接設(shè)置偏移位置,JavaScript中使用一個(gè)對(duì)象,需要通過屬性名匹配才能找到相應(yīng)的值,需要更多的操作。
在代碼執(zhí)行過程中,變量的存取是非常普遍和頻繁的,通過偏移量來存取,使用少數(shù)兩個(gè)匯編指令就能完成,如果通過屬性名匹配則需要更多的匯編指令,也需要更多的內(nèi)存空間。示例如下:

在JavaScript中,除boolean,number,string,null,undefined這個(gè)五個(gè)簡(jiǎn)單變量外,其他的數(shù)據(jù)都是對(duì)象,V8使用一種特殊的方式來表示它們,進(jìn)而優(yōu)化JavaScript的內(nèi)部表示問題。
在V8中,數(shù)據(jù)的內(nèi)部表示由數(shù)據(jù)的實(shí)際內(nèi)容和數(shù)據(jù)的句柄構(gòu)成。數(shù)據(jù)的實(shí)際內(nèi)容是變長(zhǎng)的,類型也是不同的;句柄固定大小,包含指向數(shù)據(jù)的指針。這種設(shè)計(jì)可以方便V8進(jìn)行垃圾回收和移動(dòng)數(shù)據(jù)內(nèi)容,如果直接使用指針的話就會(huì)出問題或者需要更大的開銷,使用句柄的話,只需修改句柄中的指針即可,使用者使用的還是句柄,指針改動(dòng)是對(duì)使用者透明的。
除少數(shù)數(shù)據(jù)(如整型數(shù)據(jù))由handle本身存儲(chǔ)外,其他內(nèi)容限于句柄大小和變長(zhǎng)等原因,都存儲(chǔ)在堆中。整數(shù)直接從value中取值,然后使用一個(gè)指針指向它,可以減少內(nèi)存的占用并提高訪問速度。一個(gè)句柄對(duì)象的大小是4字節(jié)(32位設(shè)備)或者8字節(jié)(64位設(shè)備),而在JavaScriptCore中,使用的8個(gè)字節(jié)表示句柄。在堆中存放的對(duì)象都是4字節(jié)對(duì)齊的,所以它們指針的后兩位是不需要的,V8用這兩位表示數(shù)據(jù)的類型,00為整數(shù),01為其他。
JavaScript對(duì)象在V8中的實(shí)現(xiàn)包含三個(gè)部分:隱藏類指針,這是v8為JavaScript對(duì)象創(chuàng)建的隱藏類;屬性值表指針,指向該對(duì)象包含的屬性值;元素表指針,指向該對(duì)象包含的屬性。
2.2.工作過程
前面有過介紹,V8引擎在執(zhí)行JavaScript的過程中,主要有兩個(gè)階段:編譯和運(yùn)行,與C++的執(zhí)行前完全編譯不同的是,JavaScript需要在用戶使用時(shí)完成編譯和執(zhí)行。在V8中,JavaScript相關(guān)代碼并非一下完成編譯的,而是在某些代碼需要執(zhí)行時(shí),才會(huì)進(jìn)行編譯,這就提高了響應(yīng)時(shí)間,減少了時(shí)間開銷。在V8引擎中,源代碼先被解析器轉(zhuǎn)變?yōu)槌橄笳Z法樹(AST),然后使用JIT編譯器的全代碼生成器從AST直接生成本地可執(zhí)行代碼。這個(gè)過程不同于JAVA先生成字節(jié)碼或中間表示,減少了AST到字節(jié)碼的轉(zhuǎn)換時(shí)間,提高了代碼的執(zhí)行速度。但由于缺少了轉(zhuǎn)換為字節(jié)碼這一中間過程,也就減少了優(yōu)化代碼的機(jī)會(huì)。
V8引擎編譯本地代碼時(shí)使用的主要類如下所示:
- Script:表示JavaScript代碼,即包含源代碼,又包含編譯之后生成的本地代碼,即是編譯入口,又是運(yùn)行入口;
- Compiler:編譯器類,輔組Script類來編譯生成代碼,調(diào)用解釋器(Parser)來生成AST和全代碼生成器,將AST轉(zhuǎn)變?yōu)楸镜卮a;
- AstNode:抽象語法樹節(jié)點(diǎn)類,是其他所有節(jié)點(diǎn)的基類,包含非常多的子類,后面會(huì)針對(duì)不同的子類生成不同的本地代碼;
- AstVisitor:抽象語法樹的訪問者類,主要用來遍歷異構(gòu)的抽象語法樹;
- FullCodeGenerator:AstVisitor類的子類,通過遍歷AST來為JavaScript生成本地可執(zhí)行代碼。

JavaScript代碼編譯的過程大致為:Script類調(diào)用Compiler類的Compile函數(shù)為其生成本地代碼。Compile函數(shù)先使用Parser類生成AST,再使用FullCodeGenerator類來生成本地代碼。本地代碼與具體的硬件平臺(tái)密切相關(guān),F(xiàn)ullCodeGenerator使用多個(gè)后端來生成與平臺(tái)相匹配的本地匯編代碼。由于FullCodeGenerator通過遍歷AST來為每個(gè)節(jié)點(diǎn)生成相應(yīng)的匯編代碼,缺失了全局視圖,節(jié)點(diǎn)之間的優(yōu)化也就無從談起。
在執(zhí)行編譯之前,V8會(huì)構(gòu)建眾多全局對(duì)象并加載一些內(nèi)置的庫(kù)(如math庫(kù)),來構(gòu)建一個(gè)運(yùn)行環(huán)境。而且在JavaScript源代碼中,并非所有的函數(shù)都被編譯生成本地代碼,而是延遲編譯,在調(diào)用時(shí)才會(huì)編譯。
由于V8缺少了生成中間代碼這一環(huán)節(jié),缺少了必要的優(yōu)化,為了提升性能,V8會(huì)在生成本地代碼后,使用數(shù)據(jù)分析器(profiler)采集一些信息,然后根據(jù)這些數(shù)據(jù)將本地代碼進(jìn)行優(yōu)化,生成更高效的本地代碼,這是一個(gè)逐步改進(jìn)的過程。同時(shí),當(dāng)發(fā)現(xiàn)優(yōu)化后代碼的性能還不如未優(yōu)化的代碼,V8將退回原來的代碼,也就是優(yōu)化回滾。下面介紹一下運(yùn)行階段,該階段使用的主要類如下所示:
- Script:表示JavaScript代碼,即包含源代碼,又包含編譯之后生成的本地代碼,即是編譯入口,又是運(yùn)行入口;
- Execution:運(yùn)行代碼的輔組類,包含一些重要函數(shù),如Call函數(shù),它輔組進(jìn)入和執(zhí)行Script代碼;
- JSFunction:需要執(zhí)行的JavaScript函數(shù)表示類;
- Runtime:運(yùn)行這些本地代碼的輔組類,主要提供運(yùn)行時(shí)所需的輔組函數(shù),如:屬性訪問、類型轉(zhuǎn)換、編譯、算術(shù)、位操作、比較、正則表達(dá)式等;
- Heap:運(yùn)行本地代碼需要使用的內(nèi)存堆類;
- MarkCompactCollector:垃圾回收機(jī)制的主要實(shí)現(xiàn)類,用來標(biāo)記、清除和整理等基本的垃圾回收過程;
- SweeperThread:負(fù)責(zé)垃圾回收的線程。

先根據(jù)需要編譯和生成這些本地代碼,也就是使用編譯階段那些類和操作。在V8中,函數(shù)是一個(gè)基本單位,當(dāng)某個(gè)JavaScript函數(shù)被調(diào)用時(shí),V8會(huì)查找該函數(shù)是否已經(jīng)生成本地代碼,如果已經(jīng)生成,則直接調(diào)用該函數(shù)。否則,V8引擎會(huì)生成屬于該函數(shù)的本地代碼。這就節(jié)約了時(shí)間,減少了處理那些使用不到的代碼的時(shí)間。其次,執(zhí)行編譯后的代碼為JavaScript構(gòu)建JS對(duì)象,這需要Runtime類來輔組創(chuàng)建對(duì)象,并需要從Heap類分配內(nèi)存。再次,借助Runtime類中的輔組函數(shù)來完成一些功能,如屬性訪問等。最后,將不用的空間進(jìn)行標(biāo)記清除和垃圾回收。
2.3.優(yōu)化回滾
因?yàn)閂8是基于AST直接生成本地代碼,沒有經(jīng)過中間表示層的優(yōu)化,所以本地代碼尚未經(jīng)過很好的優(yōu)化。于是,在2010年,V8引入了新的編譯器-Crankshaft,它主要針對(duì)熱點(diǎn)函數(shù)進(jìn)行優(yōu)化,基于JavaScript源代碼開始分析而非本地代碼,同時(shí)構(gòu)建Hydroger圖并基于此來進(jìn)行優(yōu)化分析。
Crankshaft編譯器為了性能考慮,通常會(huì)做出比較樂觀和大膽的預(yù)測(cè)—代碼穩(wěn)定且變量類型不變,所以可以生成高效的本地代碼。但是,鑒于JavaScript的一個(gè)弱類型的語言,變量類型也可能在執(zhí)行的過程中進(jìn)行改變,鑒于這種情況,V8會(huì)將該編譯器做的想當(dāng)然的優(yōu)化進(jìn)行回滾,稱為優(yōu)化回滾。
示例如下:
var counter = 0;
function test(x, y) {
counter++;
if (counter < 1000000) {
// do something
return 'jeri';
}
var unknown = new Date();
console.log(unknown);
}
該函數(shù)被調(diào)用多次之后,V8引擎可能會(huì)觸發(fā)Crankshaft編譯器對(duì)其進(jìn)行優(yōu)化,而優(yōu)化代碼認(rèn)為示例代碼的類型信息都已經(jīng)被確定。但,由于尚未真正執(zhí)行到new Date()這個(gè)地方,并未獲取unknown這個(gè)變量的類型,V8只得將該部分代碼進(jìn)行回滾。優(yōu)化回滾是一個(gè)很耗時(shí)的操作,在寫代碼過程中,盡量不要觸發(fā)優(yōu)化該操作。
在最近發(fā)布的 V8 5.9 版本中,新增了一個(gè) Ignition 字節(jié)碼解釋器,TurboFan 和 Ignition 結(jié)合起來共同完成JavaScript的編譯。這個(gè)版本中消除 Cranshaft 這個(gè)舊的編譯器,并讓新的 Turbofan 直接從字節(jié)碼來優(yōu)化代碼,并當(dāng)需要進(jìn)行反優(yōu)化的時(shí)候直接反優(yōu)化到字節(jié)碼,而不需要再考慮 JS 源代碼。
2.4.隱藏類與內(nèi)嵌緩存
2.4.1.隱藏類
在執(zhí)行C++代碼時(shí),僅憑幾個(gè)指令即可根據(jù)偏移信息獲取變量信息,而JavaScript里需要通過字符串匹配來查找屬性值的,這就需要更多的操作才能訪問到變量信息,而代碼量變量存取是十分頻繁的,這也就制約了JavaScript的性能。V8借用了類和偏移位置的思想,將本來通過屬性名匹配來訪問屬性值的方法進(jìn)行了改進(jìn),使用類似C++編譯器的偏移位置機(jī)制來實(shí)現(xiàn),這就是隱藏類。
隱藏類將對(duì)象劃分成不同的組,對(duì)于組內(nèi)對(duì)象擁有相同的屬性名和屬性值的情況,將這些組的屬性名和對(duì)應(yīng)的偏移位置保存在一個(gè)隱藏類中,組內(nèi)所有對(duì)象共享該信息。同時(shí),也可以識(shí)別屬性不同的對(duì)象。示例如下:

使用Point構(gòu)造了兩個(gè)對(duì)象p和q,這兩個(gè)對(duì)象具有相同的屬性名,V8將它們歸為同一個(gè)組,也就是隱藏類,這些屬性在隱藏類中有相同的偏移值,p和q共享這一信息,進(jìn)行屬性訪問時(shí),只需根據(jù)隱藏類的偏移值即可。由于JavaScript是動(dòng)態(tài)類型語言,在執(zhí)行時(shí)可以更改變量的類型,如果上述代碼執(zhí)行之后,執(zhí)行q.z=2,那么p和q將不再被認(rèn)為是一個(gè)組,q將是一個(gè)新的隱藏類。
2.4.2.內(nèi)嵌緩存
正常訪問對(duì)象屬性的過程是:首先獲取隱藏類的地址,然后根據(jù)屬性名查找偏移值,然后計(jì)算該屬性的地址。雖然相比以往在整個(gè)執(zhí)行環(huán)境中查找減小了很大的工作量,但依然比較耗時(shí)。能不能將之前查詢的結(jié)果緩存起來,供再次訪問呢?當(dāng)然是可行的,這就是內(nèi)嵌緩存。
內(nèi)嵌緩存的大致思路就是將初次查找的隱藏類和偏移值保存起來,當(dāng)下次查找的時(shí)候,先比較當(dāng)前對(duì)象是否是之前的隱藏類,如果是的話,直接使用之前的緩存結(jié)果,減少再次查找表的時(shí)間。當(dāng)然,如果一個(gè)對(duì)象有多個(gè)屬性,那么緩存失誤的概率就會(huì)提高,因?yàn)槟硞€(gè)屬性的類型變化之后,對(duì)象的隱藏類也會(huì)變化,就與之前的緩存不一致,需要重新使用以前的方式查找哈希表。
2.5.內(nèi)存管理
Node中通過JavaScript使用內(nèi)存時(shí)就會(huì)發(fā)現(xiàn)只能使用部分內(nèi)存(64位系統(tǒng)下約為1.4 GB,32位系統(tǒng)下約為0.7 GB),其深層原因是 V8 垃圾回收機(jī)制的限制所致(如果可使用內(nèi)存太大,V8在進(jìn)行垃圾回收時(shí)需耗費(fèi)更多的資源和時(shí)間,嚴(yán)重影響JS的執(zhí)行效率)。下面對(duì)內(nèi)存管理進(jìn)行介紹。
內(nèi)存的管理主要由分配和回收兩個(gè)部分構(gòu)成。V8的內(nèi)存劃分如下:
- Zone:管理小塊內(nèi)存。其先自己申請(qǐng)一塊內(nèi)存,然后管理和分配一些小內(nèi)存,當(dāng)一塊小內(nèi)存被分配之后,不能被Zone回收,只能一次性回收Zone分配的所有小內(nèi)存。當(dāng)一個(gè)過程需要很多內(nèi)存,Zone將需要分配大量的內(nèi)存,卻又不能及時(shí)回收,會(huì)導(dǎo)致內(nèi)存不足情況。
- 堆:管理JavaScript使用的數(shù)據(jù)、生成的代碼、哈希表等。為方便實(shí)現(xiàn)垃圾回收,堆被分為三個(gè)部分: 年輕分代:為新創(chuàng)建的對(duì)象分配內(nèi)存空間,經(jīng)常需要進(jìn)行垃圾回收。為方便年輕分代中的內(nèi)容回收,可再將年輕分代分為兩半,一半用來分配,另一半在回收時(shí)負(fù)責(zé)將之前還需要保留的對(duì)象復(fù)制過來。 年老分代:根據(jù)需要將年老的對(duì)象、指針、代碼等數(shù)據(jù)保存起來,較少地進(jìn)行垃圾回收。 大對(duì)象:為那些需要使用較多內(nèi)存對(duì)象分配內(nèi)存,當(dāng)然同樣可能包含數(shù)據(jù)和代碼等分配的內(nèi)存,一個(gè)頁(yè)面只分配一個(gè)對(duì)象。

垃圾回收
V8 使用了分代和大數(shù)據(jù)的內(nèi)存分配,在回收內(nèi)存時(shí)使用精簡(jiǎn)整理的算法標(biāo)記未引用的對(duì)象,然后消除沒有標(biāo)記的對(duì)象,最后整理和壓縮那些還未保存的對(duì)象,即可完成垃圾回收。
在V8中,使用較多的是年輕分代和年老分代。年輕分代中的對(duì)象垃圾回收主要通過Scavenge算法進(jìn)行垃圾回收。在Scavenge的具體實(shí)現(xiàn)中,主要采用了Cheney算法:通過復(fù)制的方式實(shí)現(xiàn)的垃圾回收算法。它將堆內(nèi)存分為兩個(gè) semispace,一個(gè)處于使用中(From空間),另一個(gè)處于閑置狀態(tài)(To空間)。當(dāng)分配對(duì)象時(shí),先是在From空間中進(jìn)行分配。當(dāng)開始進(jìn)行垃圾回收時(shí),會(huì)檢查From空間中的存活對(duì)象,這些存活對(duì)象將被復(fù)制到To空間中,而非存活對(duì)象占用的空間將會(huì)被釋放。完成復(fù)制后,F(xiàn)rom空間和To空間的角色發(fā)生對(duì)換。在垃圾回收的過程中,就是通過將存活對(duì)象在兩個(gè) semispace 空間之間進(jìn)行復(fù)制。年輕分代中的對(duì)象有機(jī)會(huì)晉升為年老分代,條件主要有兩個(gè):一個(gè)是對(duì)象是否經(jīng)歷過Scavenge回收,一個(gè)是To空間的內(nèi)存占用比超過限制。
對(duì)于年老分代中的對(duì)象,由于存活對(duì)象占較大比重,再采用上面的方式會(huì)有兩個(gè)問題:一個(gè)是存活對(duì)象較多,復(fù)制存活對(duì)象的效率將會(huì)很低;另一個(gè)問題依然是浪費(fèi)一半空間的問題。為此,V8在年老分代中主要采用了Mark-Sweep(標(biāo)記清除)標(biāo)記清除和Mark-Compact(標(biāo)記整理)相結(jié)合的方式進(jìn)行垃圾回收。
2.6.快照
在V8引擎啟動(dòng)時(shí),需要構(gòu)建JavaScript運(yùn)行環(huán)境,需要加載很多內(nèi)置對(duì)象,同時(shí)也需要建立內(nèi)置的函數(shù),如Array,String,Math等。為了使V8更加整潔,加載對(duì)象和建立函數(shù)等任務(wù)都是使用JavaScript文件來實(shí)現(xiàn)的,V8引擎負(fù)責(zé)提供機(jī)制來支持,就是在編譯和執(zhí)行JavaScript前先加載這些文件。
V8引擎需要編譯和執(zhí)行這些內(nèi)置的JavaScript代碼,同時(shí)使用堆等來保存執(zhí)行過程中創(chuàng)建的對(duì)象、代碼等,這些都需要時(shí)間。為此,V8引入了快照機(jī)制。將這些內(nèi)置的對(duì)象和函數(shù)加載之后的內(nèi)存保存并序列化。序列化之后的結(jié)果很容易反序列化,經(jīng)過快照機(jī)制的啟動(dòng)時(shí)間可以縮減幾毫秒。快照機(jī)制也可以將一些開發(fā)者認(rèn)為需要的JavaScript文件序列化,以減少處理時(shí)間。不過快照機(jī)制的加載的代碼不能被CrankShaft這樣的編譯器優(yōu)化,可能會(huì)存在性能問題。
3.V8 VS JavaScriptCore
JavaScriptCore引擎是WebKit中默認(rèn)的JavaScript引擎,也是蘋果開源的一個(gè)項(xiàng)目,應(yīng)用較為廣泛。最初,性能不是很好,從2008年開始了一系列的優(yōu)化,重新實(shí)現(xiàn)了編譯器和字節(jié)碼解釋器,使得引擎的性能有較大的提升。隨后內(nèi)嵌緩存、基于正則表達(dá)式的JIT、簡(jiǎn)單的JIT及字節(jié)碼解釋器等技術(shù)引入進(jìn)來,JavaScriptCore引擎也在不斷的迭代和發(fā)展。
V8引擎自誕生之日起就以性能優(yōu)化作為目標(biāo),引入了眾多新技術(shù),極大了帶動(dòng)了整個(gè)業(yè)界JavaScript引擎性能的快速發(fā)展。總的來說,V8引擎較為激進(jìn),青睞可以提高性能的新技術(shù),而JavaScriptCore引擎較為穩(wěn)健,漸進(jìn)式的改變著自己的性能。總的來說JavaScript引擎工作流程(包含v8和JavaScriptCore)如下所示:

JavaScriptCore 的大致流程為:源代碼-→抽象語法樹-→字節(jié)碼-→JIT-→本地代碼。JavaScriptCore與V8有一些不同之處,其中最大的不同就是新增了字節(jié)碼的中間表示,并加入了多層JIT編譯器(如:簡(jiǎn)單JIT編譯器、DFG JIT編譯器、LLVM等)優(yōu)化性能,不停的對(duì)本地代碼進(jìn)行優(yōu)化。(在 V8 的 5.9 版本中,新增了一個(gè) Ignition 字節(jié)碼解釋器,TurboFan 和 Ignition 結(jié)合起來共同完成JavaScript的編譯,此后 V8 將與 JavaScriptCore 有大致相同的流程,Node 8.0中 V8 版本為 5.8)
還有就是在數(shù)據(jù)表示方面,V8在不同的機(jī)器上使用與機(jī)器位數(shù)相匹配的數(shù)據(jù)表示,而在JavaScriptCore中句柄都是使用64位表示,其可以表示更大范圍的數(shù)字,所以即使在32位機(jī)器上,浮點(diǎn)類型同樣可以保存在句柄中,不再需要訪問堆中的數(shù)據(jù),當(dāng)也會(huì)占用更多的空間。
4.功能擴(kuò)展
JavaScript引擎的主要功能是解析和執(zhí)行JavaScript代碼,往往不能滿足使用者多樣化的需要,那么就可以增加擴(kuò)展以提升它的能力。V8引擎有兩種擴(kuò)展機(jī)制:綁定和擴(kuò)展。
4.1.綁定機(jī)制
使用IDL文件或接口文件生成綁定文件,將這些文件同V8引擎一起編譯。WebKit中使用IDL來定義JavaScript,但又與IDL有所不同,有一些改變。定義一個(gè)新的接口的步驟大致如下:
- 1.定義新的接口文件,可以在JavaScript代碼進(jìn)行調(diào)用,如mymodule.MyObj.myAttr;
module mymodule {
interface [
InterfaceName = MyObject
] MyObj {
readonly attribute long myAttr;
DOMString myMethod (DOMString myArg);
};
}
- 2.按照引擎定義的標(biāo)準(zhǔn)接口為基礎(chǔ)實(shí)現(xiàn)接口類,生成JavaScript引擎所需的綁定文件。WebKit提供了工具幫助生成所需的綁定類,根據(jù)引擎不同和引擎開發(fā)語言的不同而有所差異。V8引擎會(huì)為上述示例代碼生成 v8MyObj.h (MyObj類具體的實(shí)現(xiàn)代碼)和 V8MyObj.cpp (橋接代碼,輔組注冊(cè)橋接的函數(shù)到V8引擎)兩個(gè)綁定文件。
JavaScript引擎綁定機(jī)制需要將擴(kuò)展代碼和JavaScript引擎一塊編譯和打包,不能根據(jù)需要在引擎啟動(dòng)后再動(dòng)態(tài)注入這些本地代碼。在實(shí)際WEB開發(fā)中,開發(fā)者都是基于現(xiàn)有瀏覽器的,根本不可能介入到JavaScript引擎的編譯中,綁定機(jī)制有很大的局限性,但其非常高效,適用于對(duì)性能要求較高的場(chǎng)景。
4.2. Extension機(jī)制
通過V8的基類Extension進(jìn)行能力擴(kuò)展,無需和V8引擎一起編譯,可以動(dòng)態(tài)為引擎增加功能特性,具有很大的靈活性。
Extension機(jī)制的大致思路就是,V8提供一個(gè)基類Extension和一個(gè)全局注冊(cè)函數(shù),要想擴(kuò)展JavaScript能力,需要經(jīng)過以下步驟:
class MYExtension : public v8::Extension {
public:
MYExtension() : v8::Extension("v8/My", "native function my();") {}
virtual v8::Handle<v8::FunctionTemplate> GetNativeFunction (
v8::Handle<v8::String> name) {
// 可以根據(jù)name來返回不同的函數(shù)
return v8::FunctionTemplate::New(MYExtention::MY);
}
static v8::Handle<v8::Value> MY(const v8::Arguments& args) {
// Do sth here
return v8::Undefined();
}
};
MYExtension extension;
RegisterExtension(&extension);
- 1.基于Extension基類構(gòu)建一個(gè)它的子類,并實(shí)現(xiàn)它的虛函數(shù)—GetNativeFunction,根據(jù)參數(shù)name來決定返回實(shí)函數(shù);
- 2.創(chuàng)建一個(gè)該子類的對(duì)象,并通過注冊(cè)函數(shù)將該對(duì)象注冊(cè)到V8引擎,當(dāng)JavaScript調(diào)用’my’函數(shù)時(shí)就可被調(diào)用到。
Extension機(jī)制是調(diào)用V8的接口注入新函數(shù),動(dòng)態(tài)擴(kuò)展非常方便,但沒有綁定機(jī)制高效,適用于對(duì)性能要求不高的場(chǎng)景。
總結(jié)
在過去幾年,JavaScript在很多領(lǐng)域得到了廣泛的應(yīng)用,然而限于JavaScript語言本身的不足,執(zhí)行效率不高。google也推出了一些JavaScript網(wǎng)絡(luò)應(yīng)用,如Gmail、Google Maps及Google Docs office等。這些應(yīng)用的性能不僅受到服務(wù)器、網(wǎng)絡(luò)、渲染引擎以及其他諸多因素的影響,同時(shí)也受到JavaScript本身執(zhí)行速度的影響。然而既有的JavaScript引擎無法滿足新的需求,而性能不佳一直是網(wǎng)絡(luò)應(yīng)用開發(fā)者最關(guān)心的。Google就開始了V8引擎的研究,將一系列新技術(shù)引入JavaScript引擎中,大大提高了JavaScript的執(zhí)行效率。相信隨著V8引擎的不斷發(fā)展,JavaScript也會(huì)有更廣泛的應(yīng)用場(chǎng)景,前端工程師也會(huì)有更好的未來! 那么結(jié)合上面對(duì)于V8引擎的介紹,我們?cè)诰幊讨袘?yīng)注意:
- 類型。對(duì)于函數(shù),JavaScript是一種動(dòng)態(tài)類型語言,JavaScriptCore和V8都使用隱藏類和內(nèi)嵌緩存來提高性能,為了保證緩存命中率,一個(gè)函數(shù)應(yīng)該使用較少的數(shù)據(jù)類型;對(duì)于數(shù)組,應(yīng)盡量存放相同類型的數(shù)據(jù),這樣就可以通過偏移位置來訪問。
- 數(shù)據(jù)表示。簡(jiǎn)單類型數(shù)據(jù)(如整型)直接保存在句柄中,可以減少尋址時(shí)間和內(nèi)存占用,如果可以使用整數(shù)表示的,盡量不要用浮點(diǎn)類型。
- 內(nèi)存。雖然JavaScript語言會(huì)自己進(jìn)行垃圾回收,但我們也應(yīng)盡量做到及時(shí)回收不用的內(nèi)存,對(duì)不再使用的對(duì)象設(shè)置為null或使用delete方法來刪除(使用delete方法刪除會(huì)觸發(fā)隱藏類新建,需要更多的額外操作)。
- 優(yōu)化回滾。在執(zhí)行多次之后,不要出現(xiàn)修改對(duì)象類型的語句,盡量不要觸發(fā)優(yōu)化回滾,否則會(huì)大幅度降低代碼的性能。
- 新機(jī)制。使用JavaScript引擎或者渲染引擎提供的新機(jī)制和新接口提高性能。
參考資料
- 《WebKit技術(shù)內(nèi)幕》
- 《JavaScript高級(jí)程序設(shè)計(jì)》
- 《深入淺出Node.js》
- 《為什么V8引擎這么快》
- 《V8 Ignition:JS 引擎與字節(jié)碼的不解之緣 - CNode技術(shù)社區(qū)》