4.1 编译工具链

4.1 编译工具链

本节摘要：把高级语言装进字节集装箱的设备有两大家族：以 LLVM 为底的 Clang 与 Emscripten 体系，以及 Rust 官方工具链；两者之外还有优化器 Binaryen 这台几乎必开的"精整机"。本节用真实的命令行会话走完两条路线，讲清目标三元组、优化等级与体积杠杆。

wasm32-unknown-unknown 这串行话是本节最好的入口——它是一条目标三元组（target triple），三个字段分别声明 CPU 架构、厂商、系统环境。"unknown"出现在系统位上，意思是这份字节不假设任何操作系统的存在，所以它能在浏览器里跑、也能在任何带 Wasm 引擎的地方跑；把字段换成 wasm32-wasip1，字节就获得了与 WASI 系统接口对话的资格。理解三元组，工具链选型的半张考卷就答完了。

一、Emscripten 路线：存量 C 与 C++ 的主航道

Emscripten 是最老牌的 Wasm 工具链，本质是一套 clang 加链接器加移植库的组合：clang 前端把 C/C++ 编到 LLVM 中间表示，后端产出 Wasm 字节，配套的移植层把标准库调用（文件、套接字、终端）适配到浏览器环境，可选地生成一段 JavaScript 胶水负责加载与系统调用转发。

$ emcc hello.c -O3 -o hello.js        # 产出 hello.wasm 加 JS 胶水
$ emcc hello.c -O3 -o hello.html      # 连演示页面一并生成
$ emcc lib.cpp -O3 -sMODULARIZE=1 -sEXPORT_ES6=1 -o lib.js
​

三条命令对应的典型场景：第一条是最常见的"计算核心出 Web"；第二条用于快速验证；第三条的模块化与 ES 模块导出选项是现代前端集成的标配——胶水被打包成标准模块，可以进任何构建流水线。Emscripten 的立身之本是兼容性：文件系统抽象、长跳转、异常表、pthread 模拟，存量工程里那些"奇怪的 C 代码"多数不用改就能过编译。代价同样明确：胶水与运行时支撑让最小包体难以压到几十 KB 以下，纯计算的小模块用它属于杀鸡用牛刀。

二、Rust 路线：新代码的默认选项

Rust 把 Wasm 列为一级编译目标，标准工具链直接支持，无需第三方案：

$ rustup target add wasm32-unknown-unknown
$ cargo build --target wasm32-unknown-unknown --release
$ ls target/wasm32-unknown-unknown/release/
libdemo.wasm
​

这条路线的特点是"纯"：不带浏览器胶水，产出就是干净的模块字节，尺寸小、依赖少，浏览器与服务端通吃。生态工具 wasm-pack 负责把"编译产物加类型声明加包描述"打包成可发布的库，wasm-bindgen 负责生成 Rust 结构与 JavaScript 对象之间的绑定代码——字符串、结构体、回调的互操作不再是手工内存操作（第五章会看到没有它时的原始写法）。

面向 WASI 的目标把 Rust 送进服务端：

$ rustup target add wasm32-wasip1
$ cargo build --target wasm32-wasip1 --release
$ wasmtime run target/wasm32-wasip1/release/demo.wasm
​

同一个 cargo 命令、只换目标三元组，字节就从浏览器航向了独立运行时——第一章说的"接口形态决定航向"，在这里落地为一条命令的差异。

图 4-A：编译管线全景——从前端到运行时

三、Binaryen：不是可选项的精整机

字节出厂后还有一站：Binaryen 工具集里的 wasm-opt。它在字节层面做窥孔优化、死代码消除、控制流化简——很多变换发生在"已编译的 Wasm"这一层，是 LLVM 后端够不到的盲区，因此即便开了最高编译优化，再过一遍 wasm-opt 仍常有两位数百分比的体积收益：

$ wasm-opt -O3 in.wasm -o out.wasm      # 求执行速度
$ wasm-opt -Oz in.wasm -o out.wasm      # 求体积最小
$ wasm-opt -Oz --strip-debug in.wasm -o out.wasm   # 连调试段一并剥离
​

-O3 与 -Oz 的取舍值得单独交代：-O3 允许为速度展开代码，字节可能变大；-Oz 反过来为体积牺牲部分速度。Web 首屏路径常选 -Oz（下载快过一切），计算内核常选 -O3。工程化项目把这一步写进构建脚本，作为发布前的固定工序——wasm-pack 已经内置了这条流水线。

打包发布：wasm-pack 的一条龙

Rust 路线的发布端值得单独演示——从源码到可安装的 npm 包，一条命令链走完：

$ wasm-pack build --target web --out-dir pkg --release
$ ls pkg/
demo_bg.wasm    demo.js    demo.d.ts    package.json
​

产物目录里四件套各司其职：模块字节本体、绑定胶水（wasm-bindgen 生成，负责字符串与对象的手续自动化）、TypeScript 类型声明（消费方拿到完整 IDE 提示）、包描述文件。前端项目按普通 npm 依赖安装使用，跨语言调用的类型安全从构建期一路保障到编辑器里。这条流水线把"编译、优化、绑定、打包、声明"五件事串成一步，是新内核项目的标准出厂方式；对体积敏感的团队，再补上 --strip-debug 类选项与发布体积报告即可。工具链选型的功课至此闭环：目标定航线、路线定生态、优化定体积、打包定交付形态——四步各有专属的旋钮，也各有对应的检查点。

本节要点回顾

• 目标三元组定航线：unknown 系列面向无系统假设的环境，wasip 系列面向 WASI 运行时，选错目标整包返工；
• Emscripten 强在兼容：存量 C/C++ 工程与移植库是它的护城河，胶水体量是它的代价；
• Rust 路线胜在纯净：官方目标、无胶水、wasm-pack 与 wasm-bindgen 生态完整，新代码默认之选；
• wasm-opt 是常规工序：字节层的优化盲区只有它能补，-O3 求速、-Oz 求小；
• 体积优化有顺序：先裁依赖、再调优化等级、最后剥符号——没有体积报告的优化是盲调。

货装好了，下一节看码头：运行时引擎如何验证、编译、点亮这些字节，主流引擎各有怎样的性格。