為網(wǎng)絡(luò)編寫代碼有時感覺有點(diǎn)神奇，因?yàn)槲覀冊谖募芯帉懽址蛄?，在瀏覽器中打開該文件，然后觀看它的實(shí)現(xiàn)。但了解魔法背后的技術(shù)可以幫助你更好地磨練你作為程序員的手藝。

在本文中，您將通過掌握支持瀏覽器的 JavaScript 引擎的復(fù)雜性，了解 JavaScript 驅(qū)動的 Web 或移動堆棧幕后發(fā)生的事情。讓我們來分析一下 JavaScript 引擎的作用，為什么不同的平臺使用不同的引擎，它們多年來是如何發(fā)展的，以及為什么我們作為開發(fā)者應(yīng)該關(guān)心。

首先，一些術(shù)語

“JavaScript 引擎”通常被稱為虛擬機(jī)的一種。 “虛擬機(jī)”是指給定計(jì)算機(jī)系統(tǒng)的軟件驅(qū)動模擬。虛擬機(jī)有很多種類型，它們根據(jù)模擬或替代實(shí)際物理機(jī)的精確程度進(jìn)行分類。

例如，“系統(tǒng)虛擬機(jī)”提供了可以執(zhí)行操作系統(tǒng)的平臺的完整模擬。 Mac 用戶可能熟悉 Parallels，這是一個系統(tǒng)虛擬機(jī)，可讓您在 Mac 上運(yùn)行 Windows。

另一方面，“進(jìn)程虛擬機(jī)”的功能不太齊全，只能運(yùn)行一個程序或進(jìn)程。 Wine 是一個進(jìn)程虛擬機(jī)，允許您在 Linux 機(jī)器上運(yùn)行 Windows 應(yīng)用程序，但不會在 Linux 機(jī)器上提供完整的 Windows 操作系統(tǒng)。

JavaScript 引擎是一種專門用于解釋和執(zhí)行 JavaScript 代碼的進(jìn)程虛擬機(jī)。

注意：區(qū)分通過布局網(wǎng)頁來驅(qū)動瀏覽器的引擎與解釋和執(zhí)行代碼的低級 JavaScript 引擎非常重要。這篇關(guān)于瀏覽器如何工作的文章提供了很好的解釋。

那么 JavaScript 引擎到底是什么？它有什么作用？
總而言之，JavaScript 引擎的基本工作是獲取開發(fā)人員編寫的 JavaScript 代碼，并將其轉(zhuǎn)換為可以由瀏覽器解釋甚至嵌入到應(yīng)用程序中的快速、優(yōu)化的代碼。事實(shí)上，JavaScriptCore 稱自己為“優(yōu)化虛擬機(jī)”。

更準(zhǔn)確地說，每個 JavaScript 引擎都實(shí)現(xiàn)一個 ECMAScript 版本，JavaScript 是其中的一種方言。隨著 ECMAScript 的發(fā)展，JavaScript 引擎也在不斷發(fā)展。之所以有這么多不同的引擎，是因?yàn)槊總€引擎都設(shè)計(jì)用于不同的 Web 瀏覽器、無頭瀏覽器或 Node.js 等運(yùn)行時。

您可能熟悉網(wǎng)絡(luò)瀏覽器，但什么是無頭瀏覽器？它是一個沒有圖形用戶界面的網(wǎng)絡(luò)瀏覽器。它們對于針對您的網(wǎng)絡(luò)產(chǎn)品運(yùn)行自動化測試非常有用。從 Chrome 版本 59 和 Firefox 版本 56 開始，常規(guī)瀏覽器可以以這種方式使用，特別是用于測試。 Node.js 在哪里適合這個？ Node.js 是一個異步、事件驅(qū)動的框架，允許您在服務(wù)器端使用 JavaScript。由于它們是 JavaScript 驅(qū)動的工具，因此它們由 JavaScript 引擎提供支持。

考慮到上面虛擬機(jī)的定義，將 JavaScript 引擎稱為進(jìn)程虛擬機(jī)是有意義的，因?yàn)樗奈ㄒ荒康氖亲x取和編譯 JavaScript 代碼。這并不意味著它是一個簡單的引擎。例如，JavaScriptCore 有六個“構(gòu)建塊”，用于分析、解釋、優(yōu)化和垃圾收集 JavaScript 代碼。

這是如何運(yùn)作的？

這取決于引擎。讓我們考慮兩個重要的引擎：WebKit 的 JavaScriptCore 和 Google 的 V8 引擎。這兩個引擎處理代碼的方式不同。

JavaScriptCore 執(zhí)行一系列步驟來解釋和優(yōu)化腳本：

它執(zhí)行詞法分析，將源代碼分解為一系列標(biāo)記或具有已識別含義的字符串。

然后解析器會分析標(biāo)記的語法并構(gòu)建到語法樹中。

然后啟動四個 JIT（即時）進(jìn)程，分析并執(zhí)行解析器生成的字節(jié)碼。

簡單來說，這個 JavaScript 引擎獲取您的源代碼，將其分解為字符串（也稱為詞法分析），獲取這些字符串并將它們轉(zhuǎn)換為編譯器可以理解的字節(jié)碼，然后執(zhí)行它。

Google 的 V8 引擎用 C 語言編寫，還編譯和執(zhí)行 JavaScript 源代碼、處理內(nèi)存分配以及垃圾收集剩余部分。它的設(shè)計(jì)由一個編譯器管道組成，可將源代碼直接編譯為機(jī)器代碼：

• Ignition，生成字節(jié)碼的解釋器

• TurboFan，一種優(yōu)化編譯器，可將字節(jié)碼編譯為機(jī)器代碼

• SparkPlug，一個補(bǔ)充 TurboFan 的編譯器

如果您對歷史感興趣，這個新管道取代了 V8 之前使用的較舊的 Full-codegen 和 Crankshaft 雙編譯器設(shè)計(jì)。

編譯過程生成機(jī)器代碼后，引擎會將 ECMA 標(biāo)準(zhǔn)中指定的所有數(shù)據(jù)類型、運(yùn)算符、對象和函數(shù)公開給瀏覽器或任何需要使用它們的運(yùn)行時，例如 Node.js， Deno 或 Electron（由 Visual Studio Code 使用）。

一點(diǎn)繞道：運(yùn)行時

如果 JavaScript 引擎在后臺悄悄運(yùn)行，解析代碼并將其分解為可讀字符串，以便編譯器可以讀取和編譯它，那么運(yùn)行時往往會吸引更多關(guān)注。這是為什么？

眾所周知的運(yùn)行時在 JavaScript 引擎之上工作，擴(kuò)展了它們的功能。最知名的是 Node，但 Deno 和 Bun 是這個領(lǐng)域的新人。 Node 和 Deno 嵌入了 V8，Bun 嵌入了 JavaScriptCore。

Bun 聲稱比 Node 或 Deno 運(yùn)行得更快，因?yàn)?JavaScriptCore 比 V8 更快，每秒處理 69,845 個 http 請求，而 Node 為 16,288 個，Deno 為 12,926 個。

正如 Bun 的文檔所述，這些運(yùn)行時的目標(biāo)是“在瀏覽器之外運(yùn)行世界上大部分 JavaScript，為未來的基礎(chǔ)設(shè)施帶來性能和復(fù)雜性增強(qiáng)，并通過更好、更簡單的工具提高開發(fā)人員的生產(chǎn)力?！笔聦?shí)上，這些運(yùn)行時利用 JavaScript 引擎的強(qiáng)大功能使 JavaScript 在瀏覽器之外運(yùn)行。

NativeScript 是專門為使用 JavaScript 構(gòu)建的跨平臺本機(jī)移動應(yīng)用程序開發(fā)而構(gòu)建的運(yùn)行時的一個很好的示例。

這些運(yùn)行時也是為了解決 JavaScript 單線程架構(gòu)帶來的一些固有問題而構(gòu)建的。例如，Node 優(yōu)先考慮例程的異步、無線程執(zhí)行。所有這些運(yùn)行時都提供了精心策劃的開發(fā)人員體驗(yàn)，包括對深受喜愛的 API（如 fetch、websocket，甚至是 React 開發(fā)人員喜愛的 JSX）的內(nèi)置支持。這可能是它們?nèi)菀孜_發(fā)者關(guān)注的原因。

總體而言，運(yùn)行時解決了標(biāo)準(zhǔn)瀏覽器架構(gòu)及其驅(qū)動引擎的性能差距。隨著引擎的發(fā)展，這些運(yùn)行時肯定也會發(fā)展。

有哪些 JavaScript 引擎？

有多種 JavaScript 引擎可用于分析、解析和執(zhí)行客戶端代碼。隨著每個瀏覽器版本的發(fā)布，JavaScript 引擎可能會發(fā)生更改或優(yōu)化，以跟上 JavaScript 代碼執(zhí)行的最新技術(shù)水平。

在被這些引擎的名稱完全混淆之前，請記住，大量的營銷活動都投入到了這些引擎及其背后的瀏覽器中，這是很有用的。在這篇對 JavaScript 編譯的有用分析中，作者諷刺地指出：“如果你不知道，編譯器大約 37% 是由營銷組成的，而品牌重塑是你可以對編譯器做的為數(shù)不多的事情之一，從營銷角度來看，因此列車名稱為：SquirrelFish、Nitro、SFX...”

在牢記命名和重命名這些引擎的起起落落的同時，注意 JavaScript 引擎歷史上的一些重大事件也是很有用的。我為您整理了一個方便的圖表：

*JavaScriptCore 被重寫為 SquirrelFish，更名為 SquirrelFish Extreme，也稱為 Nitro。然而，將 JavaScriptCore 稱為 WebKit 實(shí)現(xiàn)（例如 Safari）底層的 JavaScript 引擎仍然是正確的說法。

**Edge 最初使用 Chakra 引擎，其中部分引擎被微軟開源。然后，Edge 被重建為 Chromium 瀏覽器，底層帶有 Blink 和 V8 JavaScript 引擎。

我們?yōu)槭裁匆P(guān)心？

JavaScript 引擎的代碼解析和執(zhí)行過程的目標(biāo)是在最短的時間內(nèi)生成最優(yōu)化的代碼。
最重要的是，這些引擎的發(fā)展與我們對發(fā)展網(wǎng)絡(luò)和移動環(huán)境以使其盡可能高性能的追求是并行的。要跟蹤這一演變，您可以在基準(zhǔn)測試圖表中查看各種引擎的表現(xiàn)，例如 arewefastyet.com 上生成的圖表。

任何 Web 開發(fā)人員都需要了解瀏覽器中固有的差異，這些瀏覽器顯示我們努力生成、調(diào)試和維護(hù)的代碼。為什么某些腳本在一種瀏覽器上運(yùn)行緩慢，但在另一種瀏覽器上運(yùn)行速度更快？

類似地，移動開發(fā)人員，尤其是那些使用 webview 來顯示其內(nèi)容編寫混合移動應(yīng)用程序的開發(fā)人員，會想知道哪些引擎正在解釋他們的 JavaScript 代碼。所有關(guān)心用戶體驗(yàn)的 Web 開發(fā)人員都應(yīng)該了解小型設(shè)備上各種瀏覽器固有的限制和提供的可能性。跟上
的變化 隨著您成為 Web、移動或應(yīng)用程序開發(fā)人員，JavaScript 引擎將是值得花時間的。

本文最初于 2015 年出現(xiàn)在 Telerik 開發(fā)者網(wǎng)絡(luò)上，此后已針對 2022 年及以后進(jìn)行了修訂和更新。維基百科的 JavaScript 引擎條目中引用了原始文章。
?

以上是什么是 JavaScript 引擎？的詳細(xì)內(nèi)容。更多信息請關(guān)注PHP中文網(wǎng)其他相關(guān)文章！