WebAssembly 簡介

WebAssembly (WASM) – 深入探討：第 1 部分

這篇文章開啟了探索 WebAssembly 的系列。 在下面查找該系列其他部分的連結。

WebAssembly，或 WASM，是一種低階的、類似彙編的語言，旨在運行在 Web 瀏覽器中使用各種程式語言建構的應用程式。 其跨平台特性和底層設計提供了接近原生的速度，解鎖了先前僅使用 JavaScript 無法實現的 Web 功能。 如果您渴望能夠處理計算密集型任務的更快的 Web 應用程序，那麼 WASM 就是解決方案。本介紹將涵蓋 WASM 的核心功能、其起源以及如何開始使用它。

什麼是 WebAssembly？

WebAssembly 是專為 Web 瀏覽器設計的低階編譯目標。 它不是一種直接執行的語言；相反，它定義了一個類似程序集的結構，其他語言可以將其編譯成。這個「編譯目標」方面是關鍵。

考慮這個 C 程式碼範例：

<code class="language-c">int a = 1;
int b = 2;
int c = a + b;</code>

C 編譯器將其翻譯為彙編指令（或機器碼）：

<code class="language-assembly">mov eax, 1    ; Load 1 into register EAX
mov ebx, 2    ; Load 2 into register EBX
add eax, ebx  ; Add EAX and EBX, result in EAX</code>

這又會產生二進位表示：

<code>00000000000000000000000000000011</code>

（注意：確切的二進位輸出因 CPU 架構而異。這是一個簡化的說明。）

C 程式碼轉換為組譯程式碼，然後轉換為二進位檔案－可由電腦直接執行。 WebAssembly 修改了這個過程。 編譯器可能會產生：

<code>$a int
$b int
$c int

set $a 1
set $b 2
set $c = add $a $b</code>

（這是僅用於說明目的的假設語法，並非實際的 WASM 語法。）

如果所有瀏覽器都能理解這種語法，它將徹底改變 Web 開發。 C、Rust 和 Go 等語言的編譯器可以產生此輸出，從而使瀏覽器能夠執行用任何語言編寫的程序，無論作業系統或瀏覽器如何。

W3C 定義的 WebAssembly 規格可確保瀏覽器對 WASM 的處理保持一致。 主流瀏覽器已經原生支援 WebAssembly。

WebAssembly 表示

WebAssembly 有兩種主要格式：

• WAT（WebAssembly 文字）： 用於偵錯和程式碼理解的文字格式。
• WASM（WebAssembly 模組）： 用於瀏覽器執行的二進位格式。

這些格式是可以互換的； WAT 可以轉換為 WASM，反之亦然。 編譯為任一版本都是可能的。

基本 WebAssembly 語法 (WAT)

讓我們回顧一下使用 WAT 的範例：

1. 宣告三個32位元整數變數：

<code class="language-c">int a = 1;
int b = 2;
int c = a + b;</code>

2. 賦值：

<code class="language-assembly">mov eax, 1    ; Load 1 into register EAX
mov ebx, 2    ; Load 2 into register EBX
add eax, ebx  ; Add EAX and EBX, result in EAX</code>

3. 新增並儲存結果：

<code>00000000000000000000000000000011</code>

WebAssembly 使用堆疊機。 get_local 將值壓入堆疊，i32.add 增加堆疊頂部的兩個元素，set_local 儲存結果。 WASM 二進位等效項是：

<code>$a int
$b int
$c int

set $a 1
set $b 2
set $c = add $a $b</code>

雖然這看起來很複雜，但請記住 WASM 是編譯目標，而不是主要程式語言。 您通常會使用高階語言編寫程式碼並編譯為 WASM。

WebAssembly 會取代 JavaScript 嗎？

不。 WASM 旨在補充 JavaScript，而不是取代它。 JavaScript 擅長 DOM 操作和基本的 Web 交互，而 WASM 則以接近原生的效能處理運算密集型任務。 這種協同作用可以實現高效率的任務分配。

WebAssembly 用例

WASM 的性能使其非常適合：

1. 影像與視訊處理
2. 遊戲（含 3D）
3. 音樂應用程式
4. 密碼學
5. 可視化工具
6. 模擬器和模擬器

現有 WASM 應用程式的範例包括 Figma、Amazon Prime Video 和 Google Earth。

超越瀏覽器的 WebAssembly

雖然最初以瀏覽器為中心，但 WASM 的功能透過 WASI（WebAssembly 系統介面）擴展到了 Web 之外。 WASI 提供標準 API，允許從單一二進位檔案建立跨平台應用程序，從而無需特定於平台的建置。

WebAssembly 之前

先前的幾個專案嘗試在瀏覽器中執行其他語言，但由於缺乏標準化、安全漏洞或效能問題（ActiveX、Java Applets、Flash、NaCl、asm.js、Dart），經常面臨限制。 WebAssembly 透過標準化、可移植性、安全性、效能和可擴展性解決了這些缺點。

結論

本介紹提供了 WebAssembly 的進階概述。後續貼文將更深入地探討特定主題並探索實用的 WebAssembly 專案。

以上是WebAssembly 簡介的詳細內容。更多資訊請關注PHP中文網其他相關文章！