Parcel 與 WebAssembly

WebAssembly

支持?jǐn)U展類型: wasm

WebAssembly 是一個(gè)新興的技術(shù)，但在不久的將來(lái)，它會(huì)對(duì) web 產(chǎn)生巨大的影響。現(xiàn)在的主流瀏覽器都支持，Nodejs 也是。WebAssembly 將啟用多種語(yǔ)言，而不僅僅是那些可以編譯成 JavaScript 的語(yǔ)言。

系統(tǒng)底層的語(yǔ)言比如：C 和 Rust 都可以編譯成二進(jìn)制格式的 WebAssembly，這樣減少文件大小并且加快了運(yùn)行時(shí)。編譯后的 WebAssembly 代碼具有原生級(jí)別的性能，一般來(lái)說(shuō)比同等的 JavaScript 更快。在不久的將來(lái)，我們很可能會(huì)看到 JavaScript 庫(kù)開(kāi)始利用 WebAssembly 來(lái)實(shí)現(xiàn)代碼中關(guān)鍵的性能部分。

在 Parcel 中非常容易使用 WebAssembly。假設(shè)你有一個(gè).wasm文件，直接像往常一樣導(dǎo)入它。同步和異步導(dǎo)入都是支持的。

// 同步導(dǎo)入
import { add } from './add.wasm'
console.log(add(2, 3))
// 異步導(dǎo)入
const { add } = await import('./add.wasm')
console.log(add(2, 3))

當(dāng)同步導(dǎo)入一個(gè).wasm文件時(shí)，Parcel 自動(dòng)生成額外的代碼以便在執(zhí)行 JavaScript 包之前載入文件。這意味著二進(jìn)制的 WebAssembly 不會(huì)以字符串的方式內(nèi)聯(lián)到你的 JavaScript 中，實(shí)際上正如你所期望的那樣作為單獨(dú)的二進(jìn)制文件載入。如此一來(lái)，你的代碼依然是同步的工作方式，Parcel 會(huì)在所有代碼工作之前處理這些需要加載的依賴項(xiàng)。

這些是所有被 Parcel 支持的bundle 加載器，這些模塊的運(yùn)行時(shí)是了解如何異步加載特定的文件格式。在以往的版本，支持動(dòng)態(tài)導(dǎo)入的 JavaScript 及 CSS 的包加載器都是寫死的。在 Parcel v1.5.0 版本，這些都是完全插件化了，你可以在插件中定義你自己的包加載器！在不久的將來(lái)這將開(kāi)啟大量有趣的功能，比如自定義的 Glimmer 的二進(jìn)制模板等。非常期待！