本系列的 第一篇文章 主要介紹引擎、執行時和呼叫堆疊。第二篇文章將深入谷歌 V8 的JavaScript引擎的內部。
概述
JavaScript引擎是執行 JavaScript 程式碼的程式或直譯器。JavaScript引擎可以實現為標準直譯器，或者以某種形式將JavaScript編譯為位元組碼的即時編譯器。
以為實現JavaScript引擎的流行專案的列表：
- V8 — 開源，由 Google 開發，用 C ++ 編寫
- Rhino — 由 Mozilla 基金會管理，開源，完全用 Java 開發
- SpiderMonkey — 是第一個支援 Netscape Navigator 的 JavaScript 引擎，目前正供 Firefox 使用
- JavaScriptCore — 開源，以Nitro形式銷售，由蘋果為Safari開發
- KJS — KDE 的引擎，最初由 Harri Porten 為 KDE 專案中的 Konqueror 網頁瀏覽器開發
- Chakra (JScript9) — Internet Explorer
- Chakra (JavaScript) — Microsoft Edge
- Nashorn, 作為 OpenJDK 的一部分，由 Oracle Java 語言和工具組編寫
- JerryScript — 物聯網的輕量級引擎
為什麼要建立V8引擎?
由谷歌構建的V8引擎是開源的，使用c++編寫。這個引擎是在谷歌Chrome中使用的，但是，與其他引擎不同的是 V8 也用於流行的 node.js。
V8最初被設計用來提高web瀏覽器中JavaScript執行的效能。為了獲得速度，V8 將 JavaScript 程式碼轉換成更高效的機器碼，而不是使用直譯器。它通過實現 JIT (Just-In-Time) 編譯器將 JavaScript 程式碼編譯為執行時的機器碼，就像許多現代 JavaScript 引擎(如SpiderMonkey或Rhino (Mozilla)) 所做的那樣。這裡的主要區別是 V8 不生成位元組碼或任何中間程式碼。
V8 曾有兩個編譯器
在 V8 的 5.9 版本出來之前，V8 引擎使用了兩個編譯器：
- full-codegen — 一個簡單和非常快的編譯器，產生簡單和相對較慢的機器碼。
- Crankshaft — 一種更復雜（Just-In-Time）的優化編譯器，生成高度優化的程式碼。
V8 引擎也在內部使用多個執行緒：
- 主執行緒執行你所期望的操作：獲取程式碼、編譯程式碼並執行它
- 還有一個單獨的執行緒用於編譯，因此主執行緒可以在前者優化程式碼的同時繼續執行
- 一個 Profiler 執行緒，它會告訴執行時我們花了很多時間，讓 Crankshaft 可以優化它們
- 一些執行緒處理垃圾收集器
當第一次執行 JavaScript 程式碼時，V8 利用 full-codegen 編譯器，直接將解析的 JavaScript 翻譯成機器程式碼而不進行任何轉換。這使得它可以非常快速地開始執行機器程式碼。請注意，V8 不使用中間位元組碼，從而不需要直譯器。
當程式碼已經執行一段時間後，分析執行緒已經收集了足夠的資料來判斷應該優化哪個方法。
接下來，Crankshaft 從另一個執行緒開始優化。它將 JavaScript 抽象語法樹轉換為被稱為 Hydrogen 的高階靜態單分配（SSA）表示，並嘗試優化 Hydrogen 圖，大多數優化都是在這個級別完成的。
內聯程式碼
第一個優化是提前內聯儘可能多的程式碼。內聯是用被呼叫函式的主體替換呼叫點（呼叫函式的程式碼行）的過程。這個簡單的步驟允許下面的優化更有意義。
隱藏類
JavaScript是一種基於原型的語言：沒有使用克隆過程建立類和物件。JavaScript也是一種動態程式語言，這意味著可以在例項化後輕鬆地在物件中新增或刪除屬性。
大多數 JavaScript 直譯器使用類似字典的結構（基於雜湊函式）來儲存物件屬性值在記憶體中的位置，這種結構使得在 JavaScript 中檢索屬性的值比在 Java 或 C＃ 等非動態程式語言中的計算成本更高。
在Java中，所有物件屬性都是在編譯之前由固定物件佈局確定的，並且無法在執行時動態新增或刪除（當然，C＃具有動態型別，這是另一個主題）。
因此，屬性值（或指向這些屬性的指標）可以作為連續緩衝區儲存在儲存器中，每個緩衝區之間具有固定偏移量， 可以根據屬性型別輕鬆確定偏移的長度，而在執行時可以更改屬性型別的 JavaScript 中這是不可能的。
由於使用字典查詢記憶體中物件屬性的位置效率非常低，因此 V8 使用了不同的方法：隱藏類。隱藏類與 Java 等語言中使用的固定物件（類）的工作方式類似，只是它們是在執行時建立的。現在，讓我們看看他們實際的例子：
一旦 “new Point（1，2）” 呼叫發生，V8 將建立一個名為 “C0” 的隱藏類。
尚未為 Point 定義屬性，因此“C0”為空。
一旦第一個語句“this.x = x”被執行（在“Point”函式內），V8 將建立一個名為 “C1” 的第二個隱藏類，它基於“C0”。 “C1”描述了可以找到屬性 x 的儲存器中的位置（相對於物件指標）。
在這種情況下，“x”儲存在偏移0處，這意味著當將儲存器中的 point 物件視為連續緩衝區時，第一偏移將對應於屬性 “x”。 V8 還將使用 “類轉換” 更新 “C0” ，該類轉換指出如果將屬性 “x” 新增到 point 物件，則隱藏類應從 “C0” 切換到 “C1”。 下面的 point 物件的隱藏類現在是“C1”。
每次將新屬性新增到物件時，舊的隱藏類都會更新為指向新隱藏類的轉換路徑。隱藏類轉換非常重要，因為它們允許在以相同方式建立的物件之間共享隱藏類。如果兩個物件共享一個隱藏類並且同一屬性被新增到它們中，則轉換將確保兩個物件都接收相同的新隱藏類以及隨其附帶的所有優化程式碼。
當語句 “this.y = y” 被執行時，會重複同樣的過程（在 “Point” 函式內部，“this.x = x”語句之後）。
一個名為“C2”的新隱藏類會被建立，如果將一個屬性 “y” 新增到一個 Point 物件（已經包含屬性“x”），一個類轉換會新增到“C1”，則隱藏類應該更改為“C2”，point 物件的隱藏類更新為“C2”。
隱藏類轉換取決於將屬性新增到物件的順序。看看下面的程式碼片段：
現在，假設對於p1和p2，將使用相同的隱藏類和轉換。那麼，對於“p1”，首先新增屬性“a”，然後新增屬性“b”。然而，“p2”首先分配“b”，然後是“a”。因此，由於不同的轉換路徑，“p1”和“p2”以不同的隱藏類別結束。在這種情況下，以相同的順序初始化動態屬性好得多，以便隱藏的類可以被重用。
內聯快取
V8利用了另一種優化動態型別語言的技術，稱為內聯快取。內聯快取依賴於這樣一種觀察，即對同一方法的重複呼叫往往發生在同一型別的物件上。這裡可以找到對內聯快取的深入解釋。
接下來將討論內聯快取的一般概念（如果您沒有時間通過上面的深入瞭解）。
那麼它是如何工作的呢? V8 維護了在最近的方法呼叫中作為引數傳遞的物件型別的快取，並使用這些資訊預測將來作為引數傳遞的物件型別。如果 V8 能夠很好地預測傳遞給方法的物件的型別，它就可以繞過如何訪問物件屬性的過程，而是使用從以前的查詢到物件的隱藏類的儲存資訊。
那麼隱藏類和內聯快取的概念如何相關呢？無論何時在特定物件上呼叫方法時，V8 引擎都必須執行對該物件的隱藏類的查詢，以確定訪問特定屬性的偏移量。在同一個隱藏類的兩次成功的呼叫之後，V8 省略了隱藏類的查詢，並簡單地將該屬性的偏移量新增到物件指標本身。對於該方法的所有下一次呼叫，V8 引擎都假定隱藏的類沒有更改，並使用從以前的查詢儲存的偏移量直接跳轉到特定屬性的記憶體地址。這大大提高了執行速度。
內聯快取也是為什麼相同型別的物件共享隱藏類非常重要的原因。 如果你建立兩個相同型別和不同隱藏類的物件（正如我們之前的例子中所做的那樣），V8將無法使用內聯快取，因為即使這兩個物件屬於同一型別，它們對應的隱藏類為其屬性分配不同的偏移量。
這兩個物件基本相同，但是“a”和“b”屬性的建立順序不同。
編譯成機器碼
一旦 Hydrogen 圖被優化，Crankshaft 將其降低到稱為 Lithium 的較低階表示。大部分的 Lithium 實現都是特定於架構的。暫存器分配往往發生在這個級別。
最後，Lithium 被編譯成機器碼。然後就是 OSR ：on-stack replacement（堆疊替換）。在我們開始編譯和優化一個明確的長期執行的方法之前，我們可能會執行堆疊替換。 V8 不只是緩慢執行堆疊替換，並再次開始優化。相反，它會轉換我們擁有的所有上下文（堆疊，暫存器），以便在執行過程中切換到優化版本上。這是一個非常複雜的任務，考慮到除了其他優化之外，V8 最初還將程式碼內聯。 V8 不是唯一能夠做到的引擎。
有一種叫去優化的安全措施來進行相反的轉換，並在假設引擎無效的情況下返回未優化的程式碼。
垃圾收集
對於垃圾收集，V8採用傳統的 mark-and-sweep 演算法 來清理舊一代。 標記階段應該停止JavaScript執行。 為了控制GC成本並使執行更穩定，V8使用增量標記：不是遍歷整個堆，嘗試標記每個可能的物件，它只是遍歷堆的一部分，然後恢復正常執行。下一個GC停止將從上一個堆行走停止的位置繼續，這允許在正常執行期間非常短暫的暫停，如前所述，掃描階段由單獨的執行緒處理。
如何編寫優化的 JavaScript
- 物件屬性的順序：始終以相同的順序例項化物件屬性，以便可以共享隱藏的類和隨後優化的程式碼。
- 動態屬性： 因為在例項化之後向物件新增屬性將強制執行隱藏的類更改，並降低之前隱藏類所優化的所有方法的執行速度，所以在其建構函式中分配所有物件的屬性。
- 方法：重複執行相同方法的程式碼將比僅執行一次的多個不同方法（由於內聯快取）的程式碼執行得更快。
- 陣列：避免稀疏陣列，其中鍵值不是自增的數字，並沒有儲存所有元素的稀疏陣列是雜湊表。這種陣列中的元素訪問開銷較高。另外，儘量避免預分配大陣列。最好是按需增長。最後，不要刪除陣列中的元素，這會使鍵值變得稀疏。
- 標記值：V8 使用 32 位表示物件和數值。由於數值是 31 位的，它使用了一位來區分它是一個物件（flag = 1）還是一個稱為 SMI（SMall Integer）整數（flag = 0）。那麼，如果一個數值大於 31 位，V8會將該數字裝箱，把它變成一個雙精度數，並建立一個新的物件來存放該數字。儘可能使用 31 位有符號數字，以避免對 JS 物件的高開銷的裝箱操作。
Ignition and TurboFan
隨著2017年早些時候釋出V8 5.9，引入了新的執行管道。 這個新的管道在實際的JavaScript應用程式中實現了更大的效能提升和顯著節省記憶體。
新的執行流程是建立在 Ignition（ V8 的直譯器）和 TurboFan（ V8 的最新優化編譯器）之上的。
自從 V8 5.9 版本問世以來，由於 V8 團隊一直努力跟上新的 JavaScript 語言特性以及這些特性所需要的優化，V8 團隊已經不再使用 full-codegen 和 Crankshaft（自 2010 年以來為 V8 技術所服務）。
這意味著 V8 整體上將有更簡單和更易維護的架構。
這些改進只是一個開始。 新的Ignition和TurboFan管道為進一步優化鋪平了道路，這些優化將在未來幾年內提升JavaScript效能並縮小V8在Chrome和Node.js中的佔用空間。
原文：https://blog.sessionstack.com...
你的點贊是我持續分享好東西的動力，歡迎點贊！
