前言

? JavaScript絕對是最火的編程語言之一，一直具有很大的用戶群，隨著在服務(wù)端的使用(NodeJs)，更是爆發(fā)了極強(qiáng)的生命力。編程語言分為編譯型語言和解釋型語言兩類，編譯型語言在執(zhí)行之前要先進(jìn)行完全編譯，而解釋型語言一邊編譯一邊執(zhí)行，很明顯解釋型語言的執(zhí)行速度是慢于編譯型語言的，而JavaScript就是一種解釋型腳本語言，支持動態(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性能有大幅度提升的呢?通過對一些書籍和文章的學(xué)習(xí)，梳理了V8的相關(guān)內(nèi)容，本文將帶你認(rèn)識V8。

1.渲染引擎及網(wǎng)頁渲染

? ?瀏覽器自從上世紀(jì)80年代后期90年代初期誕生以來，已經(jīng)得到長足的發(fā)展，其功能也越來越來豐富，包括網(wǎng)絡(luò)、資源管理、網(wǎng)頁瀏覽、多頁面管理、插件和擴(kuò)展、書簽管理、歷史記錄管理、設(shè)置管理、下載管理、賬戶和同步、安全機(jī)制、隱私管理、外觀主題、開發(fā)者工具等。在這些功能中，為用戶提供網(wǎng)頁瀏覽服務(wù)無疑是最重要的功能，下面將對相關(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,Android瀏覽器)等。WebKit是由蘋果2005年發(fā)起的一個(gè)開源項(xiàng)目，引起了眾多公司的重視，幾年間被很多公司所采用，在移動端更占據(jù)了壟斷地位，更有甚者，開發(fā)出了基于WebKit的支持HTML5的Web操作系統(tǒng)(如:chrome OS、Web OS)。

? ? ? 下面是WebKi的大致結(jié)構(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)上工作的。
• ?第三方庫，為了WebKit提供支持，如圖形庫、網(wǎng)絡(luò)庫、視頻庫等。
• ?WebCore是各個(gè)瀏覽器使用的共享部分，包括HTML解析器、CSS解析器、DOM和SVG等。JavaScriptCore是WebKit的默認(rèn)引擎，在谷歌系列產(chǎn)品中被替換為V8引擎。WebKit Ports是WebKit中的非共享部分，由于平臺差異、第三方庫和需求的不同等原因，不同的移植導(dǎo)致了WebKit不同版本行為不一致，它是不同瀏覽器性能和功能差異的關(guān)鍵部分。
• ?WebKit嵌入式編程接口，供瀏覽器調(diào)用，與移植密切相關(guān)，不同的移植有不同的接口規(guī)范。
• ?測試用例，包括布局測試用例和性能測試用例，用來驗(yàn)證渲染結(jié)果的正確性。

? ?1.2 網(wǎng)頁渲染流程

? ? ? 上面介紹了渲染引擎的各個(gè)模塊，那么一張網(wǎng)頁，要經(jīng)歷怎樣的過程，才能抵達(dá)用戶面前?

? ?

? ? ? 首先是網(wǎng)頁內(nèi)容，輸入到HTML解析器，HTML解析器解析，然后構(gòu)建DOM樹，在這期間如果遇到JavaScript代碼則交給JavaScript引擎處理;如果來自CSS解析器的樣式信息，構(gòu)建一個(gè)內(nèi)部繪圖模型。該模型由布局模塊計(jì)算模型內(nèi)部各個(gè)元素的位置和大小信息，最后由繪圖模塊完成從該模型到圖像的繪制。在網(wǎng)頁渲染的過程中，大致可分為下面3個(gè)階段:

? ? ? 1.2.1 從輸入U(xiǎn)RL到生成DOM樹

? ? ? ? ?1.地址欄輸入U(xiǎn)RL，WebKit調(diào)用資源加載器加載響應(yīng)資源;

? ? ? ? ?2.加載器依賴網(wǎng)絡(luò)模塊建立連接，發(fā)送請求并接受答復(fù);

? ? ? ? ?3.WebKit接收各種網(wǎng)頁或者資源數(shù)據(jù)，其中某些資源可能同步或異步獲取;

? ? ? ? ?4.網(wǎng)頁交給HTML解析器轉(zhuǎn)變?yōu)樵~語;

? ? ? ? ?5.解釋器根據(jù)詞語構(gòu)建節(jié)點(diǎn)，形如DOM樹;

? ? ? ? ?6.如果節(jié)點(diǎn)是JavaScript代碼，調(diào)用JavaScript引擎解釋并執(zhí)行;

? ? ? ? ?7.JavaScript代碼可能會修改DOM樹結(jié)構(gòu);

? ? ? ? ?8.如果節(jié)點(diǎn)依賴其他資源，如圖片\css、視頻等，調(diào)用資源加載器加載它們，但這些是異步加載的，不會阻礙當(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繪圖上下文

? ? ? ? ? 1.CSS文件被CSS解釋器解釋成內(nèi)部表示;

? ? ? ? ? 2.CSS解釋器完成工作后，在DOM樹上附加樣式信息，生成RenderObject樹;

? ? ? ? ? 3.RenderObject節(jié)點(diǎn)在創(chuàng)建的同時(shí)，WebKit會根據(jù)網(wǎng)頁層次結(jié)構(gòu)構(gòu)建RenderLayer樹，同時(shí)構(gòu)建一個(gè)虛擬繪圖上下文。

? ? ? ?1.2.3 繪圖上下文到最終圖像呈現(xiàn)

? ? ? ? ? 1.繪圖上下文是一個(gè)與平臺無關(guān)的抽象類，它將每個(gè)繪圖操作橋接到不同的具體實(shí)現(xiàn)類，也就是繪圖具體實(shí)現(xiàn)類;

? ? ? ? ? 2.繪圖實(shí)現(xiàn)類也可能有簡單的實(shí)現(xiàn)，也可能有復(fù)雜的實(shí)現(xiàn)，軟件渲染、硬件渲染、合成渲染等;

? ? ? ? ? 3.繪圖實(shí)現(xiàn)類將2D圖形庫或者3D圖形庫繪制結(jié)果保存，交給瀏覽器界面進(jìn)行展示。

? ? ? ?上述是一個(gè)完整的渲染過程，現(xiàn)代網(wǎng)頁很多都是動態(tài)的，隨著網(wǎng)頁與用戶的交互，瀏覽器需要不斷的重復(fù)渲染過程。

? ?1.3 JavaScript引擎

? ??

? ? ?JavaScript本質(zhì)上是一種解釋型語言，與編譯型語言不同的是它需要一邊執(zhí)行一邊解析，而編譯型語言在執(zhí)行時(shí)已經(jīng)完成編譯，可直接執(zhí)行，有更快的執(zhí)行速度(如上圖所示).JavaScript代碼是在瀏覽器端解析和執(zhí)行的，如果需要時(shí)間太長，會影響用戶體驗(yàn)。那么提高JavaScript的解析速度就是當(dāng)務(wù)之急。JavaScript引擎和渲染引擎的關(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生成本地代碼后，也會通過Profiler采集一些信息，來優(yōu)化本地代碼。雖然，少了生成字節(jié)碼這一階段的性能優(yōu)化，但極大減少了轉(zhuǎn)換時(shí)間。

? ? 但是在2017年4月底，v8的5.9版本發(fā)布了，新增了一個(gè)Ignition字節(jié)碼解釋器，將默認(rèn)啟動，從此之后將于JSCore有大致相同的流程。做出這一改變的原因?yàn)?(主要動機(jī))減輕機(jī)器碼占用的內(nèi)存空間，即犧牲時(shí)間換空間;提高代碼的啟動速度;對V8的代碼進(jìn)行重構(gòu),降低v8的代碼復(fù)雜度(V8 Ignition：JS 引擎與字節(jié)碼的不解之緣 - CNode技術(shù)社區(qū))。

? ? JavaScript的性能和C相比還有不小的距離，可預(yù)見的未來估計(jì)也只能接近它，而不是與它相比，這從語言類型上已經(jīng)決定。下面將對V8引擎進(jìn)行更為細(xì)致的介紹。

2.V8引擎

? ?V8引擎是一個(gè)JavaScript引擎實(shí)現(xiàn)，最初由一些語言方面專家設(shè)計(jì)，后被谷歌收購，隨后谷歌對其進(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等，具有很好的可移植和跨平臺特性。

? ? V8項(xiàng)目代碼結(jié)構(gòu)如下:

? ??

? ?2.1 數(shù)據(jù)表示

? ? ?JavaScript是一種無類型語言，在編譯時(shí)并不能準(zhǔn)確知道變量的類型，只可以在運(yùn)行時(shí)確定，這就不像c++或者java等靜態(tài)類型語言，在編譯時(shí)候就可以確切知道變量的類型。然而，在運(yùn)行時(shí)計(jì)算和決定類型，會嚴(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í)行期間可以修改對象屬性;
• ?偏移信息共享，C++有類型定義，執(zhí)行時(shí)不能動態(tài)改變，可共享偏移信息，JavaScript每個(gè)對象都是字描述，屬性和位置偏移信息都包含在自身的結(jié)構(gòu)中;
• ?偏移信息查找，C++查找偏移地址很簡單，在編譯代碼階段，對使用的某類型成員變量直接設(shè)置偏移位置，JavaScript中使用一個(gè)對象，需要通過屬性名匹配才能找到相應(yīng)的值，需要更多的操作。

? ? ? 在代碼執(zhí)行過程中，變量的存取是非常普遍和頻繁的，通過偏移量來存取，使用少數(shù)兩個(gè)匯編指令就能完成，如果通過屬性名匹配則需要更多的匯編指令，也需要更多的內(nèi)存空間。示例如下:

? ? ?

? ? ? ?在JavaScript中，除boolean，number，string，null，undefined這個(gè)五個(gè)簡單變量外，其他的數(shù)據(jù)都是對象，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)容是變長的，類型也是不同的：句柄固定大小，包含指向數(shù)據(jù)的指針。這種設(shè)計(jì)可以方便V8進(jìn)行垃圾回收和移動數(shù)據(jù)內(nèi)容，如果直接使用指針的話就會出問題或者需要更大的開銷，使用句柄的話，只需修改句柄中的指針即可，使用者使用的還是句柄，指針改動是對使用者透明的。

? ? ? ?除少數(shù)數(shù)據(jù)(如整型數(shù)據(jù))由handle本身存儲外，其他內(nèi)容限于句柄大小和變長等原因，都存儲在堆中。整數(shù)直接從value中取值，然后使用一個(gè)指針指向它，可以減少內(nèi)存的占用并提高訪問速度。一個(gè)句柄對象的大小是4字節(jié)(32位設(shè)備)或者8字節(jié)(64位設(shè)備),而在JavaScriptCore中，使用的8個(gè)字節(jié)表示句柄。在堆中存放的對象都是4字節(jié)對齊的，所以它們指針的后兩位是不需要的，V8用這兩位表示數(shù)據(jù)的類型，00為整形，01為其他。

? ? ? ?JavaScript對象在V8中的實(shí)現(xiàn)包含三個(gè)部分:隱藏類指針，這是V8為JavaScript對象創(chuàng)建的隱藏類;屬性值表指針，指向該對象包含的屬性值;元素表指針，指向該對象包含的屬性。

? ? 2.2 工作過程

? ? ?前面有過介紹，V8引擎在執(zhí)行JavaScript的過程中，主要有兩個(gè)階段:編譯和運(yùn)行，與C++的執(zhí)行前完全編譯不同的是，JavaScript需要在用戶使用時(shí)完成編譯和執(zhí)行。在V8中，JavaScript相關(guān)代碼并非一下完成編譯的，而是在某些代碼需要執(zhí)行時(shí)，才會進(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ī)會。

? ? ?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)的基類，包含非常多的子類，后面會針對不同的子類生成不同AST轉(zhuǎn)變?yōu)楸镜卮a：
• ? ASTVisitor：抽象語法樹的訪問者類，主要用來遍歷異構(gòu)的抽象語法樹;
• ? FullCodeGenerator: AstVisitor類的子類，通過遍歷AST來為JavaScript生成本地可執(zhí)行代碼.

? ? ?

? ? ? JavaScript代碼編譯的過程大致為: Script類調(diào)用Compiler類的Compile函數(shù)為其生成本地代碼。Compile函數(shù)先使用Parser類生成AST，再使用FullCodeGenerator類來生成本地代碼。本地代碼與具體的硬件平臺密切相關(guān)，FullCodeGenerator使用多個(gè)后端來生成與平臺相匹配的本地匯編代碼。由于FullCodeGenerator通過遍歷AST來為每個(gè)節(jié)點(diǎn)生成相應(yīng)的匯編代碼，缺失了全局視圖，節(jié)點(diǎn)之間的優(yōu)化也就無從談起。

? ? ? 在執(zhí)行編譯之前，V8會構(gòu)建眾多全局對象并加載一些內(nèi)置的庫(如math庫),來構(gòu)建一個(gè)運(yùn)行環(huán)境。而且在JavaScript源代碼中，并非所有的函數(shù)都被編譯生成本地代碼，而是延遲編譯，在調(diào)用時(shí)才會編譯。

? ? ? 由于V8缺少了生成中間代碼這一環(huán)節(jié)，缺少了必要的優(yōu)化，為了提升性能，V8會在生成本地代碼后，使用數(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會查找該函數(shù)是否已經(jīng)生成本地代碼，如果已經(jīng)生成，則直接調(diào)用該函數(shù)。否則，V8引擎會生成屬于該函數(shù)的本地代碼。這就節(jié)約了事件，減少了處理那些使用不到的代碼的時(shí)間。其次，執(zhí)行編譯后的代碼為JavaScript構(gòu)建JS對象，這需要Runtime類來輔助創(chuàng)建對象，并需要從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，它主要針對熱點(diǎn)函數(shù)進(jìn)行優(yōu)化，基于JavaScript源代碼開始分析而非本地代碼，同時(shí)構(gòu)建Hydroger圖并基于此來進(jìn)行優(yōu)化分析。

? ? ? ?CrankShaft編譯器為了性能考慮，通常會做出比較樂觀和大膽的預(yù)測---代碼穩(wěn)定且變量類型不變，所以可以生成高效的本地代碼。但是，鑒于JavaScript的一個(gè)弱類型的語言，變量類型也可能在執(zhí)行的過程中進(jìn)行改變，鑒于這種情況，V8會將該編譯器做的想當(dāng)然的優(yōu)化進(jìn)行回滾，稱為優(yōu)化回滾。

? ? ? 示例如下：

var counter = 0; function test(x, y) {counter++;if (counter < 1000000) {// do somethingreturn 'jeri';}var unknown = new Date();console.log(unknown); }

? ? ? 該函數(shù)被調(diào)用多次之后，V8引擎可能會觸發(fā)CrankShaft編譯器對其進(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)，這就是隱藏類。

? ? ? 隱藏類將對象劃分成不同的組，對于組內(nèi)對象擁有相同的屬性名和屬性值的情況，將這些組的屬性名和對應(yīng)的偏移位置保存在一個(gè)隱藏類中，組內(nèi)所有對象共享該信息。同時(shí)，也可以識別屬性不同的對象。示例如下:

? ??

? ? 使用Point構(gòu)造了兩個(gè)對象p和q,這兩個(gè)對象具有相同的屬性名，V8將它們歸為同一個(gè)組，也就是隱藏類，這些屬性在隱藏類中有相同的偏移值，p和q共享這一信息，進(jìn)行屬性訪問時(shí)，只需根據(jù)隱藏類的偏移值即可。由于JavaScript是動態(tài)類型語言，在執(zhí)行時(shí)可以更改變量的類型，如果上述代碼執(zhí)行之后，執(zhí)行q.z=2,那么p和q將不再被認(rèn)為是一個(gè)組，q將是一個(gè)新的隱藏類。(因?yàn)閷傩砸呀?jīng)不再一致了).

? ? 2.4.2 內(nèi)嵌緩存

? ? ? 正常訪問對象屬性的過程是:首先獲取隱藏類的地址,然后根據(jù)屬性名查找偏移值，然后計(jì)算該屬性的地址。雖然相比以往在整個(gè)執(zhí)行環(huán)境中查找減少了很大的工作量，但依然比較耗時(shí)，能不能將之前查詢的結(jié)果緩存起來，供再次訪問呢?當(dāng)然是可行的，這就是內(nèi)嵌緩存。

? ? ? 內(nèi)嵌緩存的大致思想就是將初次查找的隱藏類和偏移值保存起來，當(dāng)下次查找的時(shí)候，先比較當(dāng)前對象是否是之前的隱藏類，如果是的話，直接使用之前的緩存結(jié)果，較少再次查找表的時(shí)間。當(dāng)然，如果一個(gè)對象有多個(gè)屬性，那么緩存失誤的概率就會提高，因?yàn)槟硞€(gè)屬性的類型變化之后，對象的隱藏類也會變化，就與之前的緩存不一致，需要重新使用以前的方式查找哈希表。

? 2.5 內(nèi)存管理

? ? Node中通過JavaScript使用內(nèi)存時(shí)就會發(fā)現(xiàn)只能使用部分內(nèi)存(64系統(tǒng)下約為1.4GB,32位系統(tǒng)下約為0.7GB),其深層原因是V8垃圾回收機(jī)制的限制所致(如果可使用內(nèi)存太大，V8在進(jìn)行垃圾回收時(shí)需耗費(fèi)更多的資源和事件，嚴(yán)重影響JS的執(zhí)行效率).下面對內(nèi)存管理進(jìn)行介紹：

? ? ?內(nèi)存的管理組要由分配和回收兩個(gè)部分構(gòu)成。V8的內(nèi)存劃分如下:

• ? Zone: 管理小塊內(nèi)存。其先自己申請一塊內(nèi)存，然后管理和分配一些小內(nèi)存，當(dāng)一塊小內(nèi)存被分配之后，不能被Zone回收，只能一次性回收Zone分配的所有小內(nèi)存。當(dāng)一個(gè)過程需要很多內(nèi)存，Zone將需要分配大量的內(nèi)存，卻又不能及時(shí)回收，會導(dǎo)致內(nèi)存不足情況。
• ? 堆:管理JavaScript使用的數(shù)據(jù)、生成的代碼、哈希表等。為方便實(shí)現(xiàn)垃圾回收，堆被分為三個(gè)部分:

? ? ? ? ? 年輕分代:為新創(chuàng)建的對象分配內(nèi)存空間，經(jīng)常需要進(jìn)行垃圾回收。為方便年輕分代中的內(nèi)容回收，可再將年輕分代分為兩半，一般用來分配，另一半在回收時(shí)負(fù)責(zé)將之前還需要保留的對象復(fù)制過來。

? ? ? ? ? 年老分代:根據(jù)需要將年老的對象、指針、代碼等數(shù)據(jù)保存起來，較少地進(jìn)行垃圾回收。

? ? ? ? ? 大對象:為那些需要使用較多內(nèi)存對象分配內(nèi)存，當(dāng)然同樣可能包含數(shù)據(jù)和代碼等分配的內(nèi)存，一個(gè)頁面只分配一個(gè)對象。

? ? ??

? ? ? 垃圾回收

? ? ? V8使用了分代和大數(shù)據(jù)的內(nèi)存分配，在回收內(nèi)存時(shí)使用精簡整理的算法標(biāo)記未利用的對象，然后消除沒有標(biāo)記的對象，最后整理和壓縮那些還未保存的對象，即可完成垃圾回收。

? ? ? 在V8中，使用較多的是年輕分代和年老分代。年輕分代中的對象垃圾回收主要通過Scavenge算法進(jìn)行垃圾回收。在Scavenge的具體實(shí)現(xiàn)中，主要采用了Cheney算法:通過復(fù)制的方式實(shí)現(xiàn)的垃圾回收算法。它將堆內(nèi)存分為兩個(gè)semispace，一個(gè)處于使用中(From空間),另一個(gè)處于閑置狀態(tài)(To空間)。當(dāng)分配對象時(shí)，先是在From空間中進(jìn)行分配。當(dāng)開始進(jìn)行垃圾回收時(shí)，會檢查From空間中的存活對象，這些存活對象將被復(fù)制到To空間中，而非存活對象占用的空間將被釋放。完成復(fù)制后，From空間和To空間的角色發(fā)生兌換。在垃圾回收的過程中，就是通過將存活對象在兩個(gè)semispace空間之間進(jìn)行復(fù)制。年輕分代中的對象有機(jī)會晉升為年老分代，條件主要有兩個(gè):一個(gè)是對象是否經(jīng)歷過Scavenge回收，一個(gè)是To空間的內(nèi)存占用比超過限制。

? ? ? ?對于年老分代中的對象，由于存活對象占較大比重，再采用上面的方式會有兩個(gè)問題:一個(gè)是存活對象較多，復(fù)制存活對象的效率將會很低;另一個(gè)問題依然是浪費(fèi)一半空間的問題。為此，V8在年老分代中主要采用了Mark-Sweep(標(biāo)記清除)標(biāo)記清除和Mark-Compact(標(biāo)記整理)相結(jié)合的方式進(jìn)行垃圾回收。

? ?2.6 快照

? ? ? 在V8引擎啟動時(shí)，需要構(gòu)建JavaScript運(yùn)行環(huán)境，需要加載很多內(nèi)置對象，同時(shí)也需要建立內(nèi)置的函數(shù)，如Array，String，Math等。為了使V8更加整潔，加載對象和建立函數(shù)等任務(wù)都是使用JavaScript文件來實(shí)現(xiàn)的，V8引擎負(fù)責(zé)提供機(jī)制來支持，就是在編譯和執(zhí)行JavaScript前先加載這些文件。

? ? ? V8引擎需要編譯和執(zhí)行這些內(nèi)置的JavaScript代碼，同時(shí)使用堆等來保存執(zhí)行過程中創(chuàng)建的對象、代碼等，這些都需要事件。為此，V8引入了快照機(jī)制。將這些內(nèi)置的對象和函數(shù)加載之后的內(nèi)存保存并序列化。序列化之后的結(jié)果很容易反序列化，經(jīng)過快照機(jī)制的啟動事件可以縮減幾毫秒。快照機(jī)制也可以將一些開發(fā)者認(rèn)為需要的JavaScript文件序列化，以減少處理時(shí)間。不過快照機(jī)制的加載的代碼不能被CrankShaft這樣的編譯器優(yōu)化，可能會存在性能問題。

? 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、簡單的JIT及字節(jié)碼解釋器等技術(shù)引入進(jìn)來，JavaScriptCore引擎也在不斷的迭代和發(fā)展。

? ? ? V8引擎自誕生之日起就以性能優(yōu)化作為目標(biāo)，引入了眾多新技術(shù)，極大地帶動了整個(gè)業(yè)界JavaScript引擎性能的快速發(fā)展，總的來說，V8引擎較為激進(jìn)，青睞可以提高性能的新技術(shù)，而JavaScriptCore引擎較為穩(wěn)健，漸進(jìn)式的改變著自己的性能。總的來說JavaScript引擎工作流程（包含V8和javaScriptCore）如下所示:

? ??

? ? ?JavaScriptCore的大致流程為: 源代碼-->抽象語法樹-->字節(jié)碼-->JIT-->本地代碼。JavaScriptCore與V8有一些不同之處，其中最大的不同就是新增了字節(jié)碼的中間表示，并加入了多層JIT編譯器(如:簡單JIT編譯器、DFG JIT編譯器、LLVM等)優(yōu)化性能，不停的對本地處理進(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)然也會占用更多的空間。

? 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引擎會為上述示例代碼生成v8MyObj.h(MyObj類具體的實(shí)現(xiàn)代碼)和V8MyObj.cpp(橋接代碼，輔助注冊橋接的函數(shù)到V8引擎)兩個(gè)綁定文件。

? ? ? JavaScript引擎綁定機(jī)制需要將擴(kuò)展代碼和JavaScript引擎一塊編譯和打包，不能根據(jù)需要在引擎啟動后再注入這些本地代碼。在實(shí)際WEB開發(fā)中，開發(fā)者都是基于現(xiàn)有瀏覽器的，根本不可能介入到JavaScript引擎的編譯中，綁定機(jī)制有很大的局限性，但其非常高效，適用于對性能要求較高的場景。

? ? 4.2 Extension機(jī)制

? ? ? 通過V8的基類Extension進(jìn)行能力擴(kuò)展，無需和V8引擎一起編譯，可以動態(tài)為引擎增加功能特性，具有很大的靈活性。

? ? ? Extension機(jī)制的大致思路是,V8提供一個(gè)基類Extension和一個(gè)全局注冊函數(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(MYExtension::MY);}static v8::Handle<v8::Value> MY(const v8::Arguments& args) {//Do sth herereturn 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è)該子類的對象，并通過注冊函數(shù)將該對象注冊到v8引擎，當(dāng)JavaScript調(diào)用'my'函數(shù)時(shí)就可被調(diào)用到。

? ? Extension機(jī)制是調(diào)用v8的接口注入新函數(shù)，動態(tài)擴(kuò)展非常方便，但沒有綁定機(jī)制高效，適用于對性能要求不高的場景。

? 總結(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也會有更廣泛的應(yīng)用場景，前端工程師也會有更好的未來!

?那么結(jié)合上面對于V8引擎的介紹，我們在編程中應(yīng)注意:

• ? 類型。對于函數(shù)，JavaScript是一種動態(tài)類型語言，JavaScriptCore和V8都使用隱藏類和內(nèi)嵌緩存來提高性能，為了保證緩存命中率，一個(gè)函數(shù)應(yīng)該使用較少的數(shù)據(jù)類型;對于數(shù)組，應(yīng)盡量存放相同類型的數(shù)據(jù)，這樣就可以通過偏移位置來訪問。
• ? 數(shù)據(jù)表示。簡單類型數(shù)據(jù)(如整形)直接保存在句柄中，可以減少尋址時(shí)間和內(nèi)存占用，如果可以使用整數(shù)表示的，盡量不要用浮點(diǎn)類型。
• ? 內(nèi)存。雖然JavaScript語言會自己進(jìn)行垃圾回收，但我們也應(yīng)盡量做到及時(shí)回收不用的內(nèi)存，對不再使用的對象設(shè)置為null或使用delete方法刪除會觸發(fā)隱藏類新建，需要更多的額外操作)。
• ? 優(yōu)化回滾。在執(zhí)行多次之后，不要出現(xiàn)修改對象類型的語句，盡量不要觸發(fā)優(yōu)化回滾，否則會大幅度降低代碼的性能。
• ? 新機(jī)制。使用JavaScript引擎或者渲染引擎提供的新機(jī)制和新接口提高性能。

? 參考資料

• ? ? 《WebKit技術(shù)內(nèi)幕》
• ? ? 《JavaScript高級程序設(shè)計(jì)》
• ? ? ?《深入淺出Node.js》
• V8 Ignition：JS 引擎與字節(jié)碼的不解之緣 - CNode技術(shù)社區(qū)
• 為什么V8引擎這么快

總結(jié)

以上是生活随笔為你收集整理的v8引擎详解的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。