关于webassembly:Emscripten-Under-the-hood

前言

本文面向曾经写过 Emscripten 三方库的新手和从没听说过 Emscripten 的前端开发者。将致力从不同视角还原 Emscripten 事实标准框架的运行原理，突破 WASM 黑盒，播种 WASM 和原生利用的性能 & 架构差别；通过比照了解 JavaScript 中一些天经地义景象背地暗藏的简单逻辑。

ChatGPT 对 Emscripten 的了解:

发布会

大一统

1974 年，贝尔实验室正式对外公布 Unix 及其源代码，这款分时操作系统的设计哲学如此对立，使其能在不同制造商机器上运行。Unix 十分受欢迎，一些像 BSD(Berkeley Software Distribution) 还有 Sun 公司的 Solaris 等等 Unix-like OS 相继冒了进去。到 80 年中期，各种衍生零碎被 Unix 发行厂商退出新性能，越来越个性化。使软件在 OS 之间互相移植变得越来越艰难，这重大违反了 Unix 哲学：”Choose portability over efficiency.“。于是 IEEE 为了拨乱反正，开始插手制订基于 Unix 的规范，涵盖网络、线程、文件 IO 以及 C 语言接口等，甚至包含开关机流程，规范定义了整个操作系统，由自由软件静止精神领袖 Richard Stallman 命名为 POSIX。

Linus 在《Just for Fun》中提到当年因为没有获取 POSIX 规范的渠道，简直齐全是照着 Sun 公司的 Unix 手册在写 Linux，因而很多 Unix 程序也能轻松迁徙到 Linux。另外 Microsoft 为了拉新也跟风推出了 POSIX-“compliant 零碎 Windows NT，嵌入到内核中。帮忙 Win10 推出了 WSL，1.0 版本即能无需编译、原生运行 Linux 利用。

libc

POSIX 通过 C 语言申明了 零碎调用，C 语言也有本人的规范库，在历史倒退中两者逐步交融，前者或后者都能够用来称说 libc。以后 Linux 最风行的 libc 实现诞生于 GNU 打算 的 glibc。

glibc 蕴含零碎调用申明和 库函数(比方: strlen)，个别程序在被 GCC 或 clang 编译时会将库函数生成的对象文件动态链接到产物中，零碎调用则根据 POSIX 标准生成指定汇编代码。因此只依赖 glibc 的程序在 macOS 和 Linux 之间迁徙非常简单。

iOS 和 Android 都属于 unix-like 零碎，利用无奈做到源码移植的起因是在自家零碎封装了 XNU 和 AOSP。构建 APP 大量依赖了 POSIX 之外的 API，两者关系如下图：

应用源码装置像 Homebrew 这样的原生利用，须要装置 Xcode 开发者工具，因为其内置了 libc 和 Darwin 专属的零碎调用申明。

简直所有利用都通过 libc 实现零碎调用，包含 Node.js 和 Python3.x 等解释器。因为零碎调用有必要会切换到内核态的缘故，性能远低于一般函数。日常开发可应用 strace 或 dtruss 跟踪零碎调用。

POSIX 零碎横截面示意图:

printf 最终把后果写入 /dev/stdout 设施文件 中，零碎会将指令发送到对应驱动，在终端显示 ”hello world”。

C++ to Web

WebAssembly 设计之初就思考了 Web 的移植和性能问题，当初 LLVM backend 曾经能输入 WASM 格局的二进制汇编文件。Emscripten 集成了 LLVM clang 和 backend 把 C++ 转换成 WASM，Emscripten 工作流程:

LLVM IR 标准让混合编译变得更加容易，backend 标准化了穿插编译的输入输出，当初 Rust/Golang 都能较轻松地转换到 WASM。而 Emscripten 比 WASM 技术还要古老，1.37.3 版本后才反对 WASM，在 WASM 之前仅反对 asm.js 格局。除了 wasm 之外，还包含 glue 胶水代码，除了治理 wasm 生命周期，WebAssembly 从设计之初就无法访问浏览器环境，因而用 JS 实现了 POSIX 中的零碎调用 API。Emscripten 横截面示意图:

如图，除却模块生命周期治理代码外，灰色区域逻辑由胶水代码负责：

1. 零碎调用，Emscripten 会把 C++ 中依赖的零碎调用 API 替换成 JS 代码，如 printf 最终会执行到 console.log，外围胶水代码
2. 胶水接口，一些零碎调用能力也会通过 JavaScript 接口公开裸露到全局上下文 Module 中，例如 FS 文件系统
3. JS in C++，Emscripten 通过宏定义提供了在 C++ 中写 JS 代码的能力，编译后对应 JS 逻辑会放到胶水代码中

开箱

外观介绍

装置 Emscripten 须要先克隆 emsdk 到本地，内置 LLVM、Node.js、Python 以及 Java 等工具集，提供一个残缺的编译环境。emsdk 提供了主动 / 手动装置指定 emscripten-core/emscripten 版本的命令，后者囊括了构建脚本、胶水代码库以及测试用例和官网文档；Emscripten 版本指的也是它，更版频率大概 1~2 周，最新已达 3.1.27。

机身构造

为了保障环境对立，emsdk 还能够装置 / 查问 / 治理 python/node/llvm/musl 等依赖库，musl 是 Emscripten 应用的开源 libc。应用编译环境须要先执行 emsdk_env.sh，外部把各依赖的 /bin 门路增加到 $PATH 中。

装置好的 emscripten 内蕴含了胶水 JS 文件、C/C++ 库、以及测试用例。编译命令脚本 emcc/em++ 的编译选项定义在 settings.h 中，有 231 个配置项。include/emscripten.h 定义 Emscripten 独自提供的函数、宏定义以及类型别名，比方 emscripten_debugger，会调用 JS 的 debugger，从而疾速打断点调试。

疾速上手

通过测试用例学习某个库如何应用，查看生成的胶水代码能够单步调试剖析外部流程逻辑，C/C++ 也一样，独自开启 source-map 后还原库和业务代码：

开机启动

应用编译选项 -sUSE_PTHREADS 可开启多线程能力反对，PThread 即 POSIX Thread。编译产物蕴含 wasm 模块、wasm.js 胶水代码和 worker.js 线程 (worker) 启动脚本。独自 wasm 模块只用 WebAssembly.instantiate 就能实现初始化，但无奈享受到胶水代码的 POSIX API 实现和其它便捷函数。

脚本模式下 wasm.js 作为 script 引入，自执行会触发初始化逻辑，通过回调告诉内部 init 实现。Emscripten 生命周期钩子、第三方插件逻辑等根本都能够用回调赋值和编译替换两种形式注入。加载运行残缺产物的流程如下：

图中仅代表代码在文件中自上而下的程序，与理论执行时序无关。如图，与原生利用中 main 函数作为利用执行的入口不同，WASM 中的 main 函数不影响程序的生命周期，其返回也不意味着 “WASM 程序 ” 终止。因此 Web 应用 WASM 模块并非内嵌了一个黑盒 APP，反而像是引入了一个 状态库，库中有个 main 函数在初始化阶段可选的调用，C/C++ 除了变量申明赋值无奈执行逻辑在函数体外。音讯循环利用迁到 WASM 可应用 emscripten_set_main_loop 模仿：

emscripten_set_main_loop 第二个参数示意循环周期，如果是 0 则应用 requestAnimationFrame。

run 函数
run 函数负责调用各种 pre/post 回调钩子，实现生成 WASM 实例后的初始化。机会有 wasm.js 自执行阶段和 removeRunDependency 移除完所有依赖。

所有内置依赖都会同步的生成到 wasm.js 中，比方同样是自执行的 createWasm 函数，函数入口会减少 wasm-instantiate 依赖，直到编译、实例化 WASM 模块才移除依赖(执行 run 函数)。还有动静库预载(如果有) preloadDylibs 和 IndexedDB 缓存同步 syncfs 等，这些依赖在自执行阶段被增加，全都实现再触发 run 函数，通过 onRuntimeInitialized 告知业务初始化完结。

pre/post-js

--pre-js=files 和 --post-js=files 两个编译选项注入代码到文件头 / 尾，比方应用 pre-js 能够拿到实在脚本开始执行工夫，防止下载和代码解析烦扰。Emscripten 构建脚本 emcc 会用宏定义和槽位匹配两种形式替换生成代码。

线程生命周期

除了在 C/C++ 中应用 POSIX 头文件 <pthread.h> 里的 API pthread_create，还能够在编译时减少 -sPTHREAD_POOL_SIZE=n 参数，使胶水代码 wasm.js 于自执行阶段创立 n 条线程。线程创立流程如下：

如果 unsedWorkers 池中无闲暇线程，则新建 worker：

1. 发送 load 事件，带上曾经构建好的 [WebAssembly.Memory](https://developer.mozilla.org/en-US/docs/WebAssembly/JavaScript_interface/Memory){shared: true}、WebAssembly.Module 以及胶水代码 wasm.js
2. worker.js 利用 wasm.js 同步地创立 WASM 实例，返回 loaded 事件给主线程
3. 主线程发送 run 事件，worker 接管后开始初始化线程，记录线程启动工夫和调配堆栈上上限

销毁线程分为回收和齐全杀死两种，回收开释线程内存，worker 可留作下一次复用，节约启动工夫；杀死则彻底销毁 worker。

拆机

产物剖析

残缺的 Emscripten 产物蕴含三个文件：

1. .wasm 二进制文件，C/C++ 逻辑转译产物
2. wasm.js，负责开启启动，还有承载了 POSIX 在 Web 上的模仿实现
3. worker.js，PThread 的 worker 实现，建设和主线程绑定关系后交给 wasm.js 启动

转译 C/C++
Emscripten 外部应用 clang 编译 C/C++ 代码，被编译的代码分为业务工程代码、外部框架代码和动态库三局部。简单的业务工程可能须要由 make 或 Ninja 等规定工具。emcc 在交给 clang 之前，会把 musl 中 POSIX 零碎申明以 文件粒度 替换成 Emscripten 实现，应用 .py 脚本拼接硬编码，生成 Ninja 规定，领导 链接程序：

这些文件里的函数依靠 Web 能力，最终将调用 JS 实现。以 POSIX 杀死线程 pthread_kill API 举例，通过脚本实现 POSIX 库文件替换，前后区别：

如图，__pthread_kill_js 是一个 ” 内部实现 ” 函数，C/C++ 只有函数申明，编译到 WASM 将生成一条 import 指令，申明实例化 WASM 须要传入的 JS 函数。import 指令是一个二级构造，其它编译工具默认一级名称为 env。Emscripten 共实现了 82 个替换文件。

musl libc 中没有的函数，须要引入 libpng 和 libogg 等第三方库，减少命令行参数 -sUSE_LIBPNG 给 emcc，emcc 从 Emscripten 依赖动态库列表 下载动态库 .a，链接阶段 wasm-ld 把 .a 放到命令参数 靠右 地位，业务工程被链接的 .o 靠左，链接器 wasm-ld 从左到右解析文件，遇到函数申明就退出符号表，发现定义则删除。遍历一轮符号表不为空，报出谬误 xxx 函数没找到。

clang 编译生成的 .o 对象文件和第三方 .a 动态库，甚至 .so 动静库都听从 ELF 标准。不同的是 .o 和 .a 比 IR 更靠近源代码，根本算是二进制的源码，能够把几个 .o 退出打包进另一个 .a。动静库与平台绑定，不参加程序本体的编译、链接流程。

胶水 JS
wasm.js 和 worker.js 来自于多份 ” 预处理 JS” 经 parseTools.js 解析，按行匹配代码，检测到宏执行对应操作，相当于一个模板引擎。

如图：

1. 断言宏，callMain 执行时如果开启了断言(settings.ASSERTIONS = 1)，保留 #3 代码。运行阶段发现 run 依赖没清空则终止运行并报错。
2. include 宏，用 Fetch.js 内容替换以后地位。

预处理完的代码会交给 eval 执行 mergeInto，将函数定义收集到对立对象 “Module”，通过 ” 二次预处理 ” 后，输入到 wasm.js，挂载到 Module['asm']，在实例化 WASM 时传给它。”__sig” 会生成一份 ” 函数定义 ”，遇到 C++ 函数重载，要求签名统一。

VESDK 疾速导入读取 Blob 函数。

运行时动静生成函数可通过 WebAssembly.Table 实现，原理是 JS 和 C++ 侧把各自的函数对象、函数指针绑定到 Table 指定 index 中，Table 实现封装。

因为 WASM 汇编指令函数申明的 参数列表 / 返回值类型 只能是整数或浮点，传递简单数据时，只能当指针用：

Emscripten 提供了 WebAssembly.Memory.buffer 的多种 HEAP View。在 取对应类型值得把指针按 item 长度整除。

构造体传递时，JS 了解 C/C++ 对象模型十分艰难，还好 Emscripten 编译阶段提供了偏移计算语法：

如图，fetchXHR 是定义在 library_fetch.js 的函数，为 C/C++ 提供网络能力反对。调用 fetchXHR 前，C/C++ 侧先申请一段 emscripten_fetch_t 构造体对应大小的内存，拿到内存首字节指针，给偏移量为 ”url” 赋值。JS 则按雷同偏移取值。

文件系统

Emscripten 能够在浏览器和 Node.js 运行，编译到 Node.js 应用自带的 fs API；浏览器出于平安思考，无法访问宿主文件系统。而且 JS 只能异步读取文件 buffer，而 C/C++ 应用 POSIX API 同步读取，因而 Emscripten 提供了一套虚构文件系统的 POSIX 实现，C/C++ 应用这套 FS 可间接 include fstream、stdio.h 这两个头文件。

MEMFS

全称 Memory FS，应用纯 JS 模仿了一套文件系统，文件本体作为 buffer 在内存里（WebAssembly.Memory 外）；因而子线程读写文件须要代理到主线程：

如图，Emscripten 许多 POSIX 能力都会代理到主线程执行，线程读取文件，创立代理工作投递到主线程执行，并陷入自旋锁，直到工作实现后解开，因而十分依赖主线程执行能力。如果主线程忙碌，worker 性能将会一起被连累。

wasmFS

随着 wasmfs 的推动与 OPFS 规范的上线，这个问题将失去很大的改善，它将文件数治理移到了 C ++ 层，从而充分利用 SharedArrayBuffer 的跨线程能力，防止了所有操作代理到主线程的问题。
Emscripten: Under the hood

前言

WebSDK 在智创云曾经驱动了模板预览 / 混剪 / 卡片模板以及通用视频编辑器，内置的 WASM 模块由 Emscripten 从 VE C++ 编译而成，附带一些 JS 胶水代码。

本文面向曾经写过 Emscripten 三方库的新手和从没听说过 Emscripten 的前端开发者。将致力从不同视角还原 Emscripten 事实标准框架的运行原理，突破 WASM 黑盒，播种 WASM 和原生利用的性能 & 架构差别；通过比照了解 JavaScript 中一些天经地义景象背地暗藏的简单逻辑。

ChatGPT 对 Emscripten 的了解:

发布会

大一统

1974 年，贝尔实验室正式对外公布 Unix 及其源代码，这款分时操作系统的设计哲学如此对立，使其能在不同制造商机器上运行。Unix 十分受欢迎，一些像 BSD(Berkeley Software Distribution) 还有 Sun 公司的 Solaris 等等 Unix-like OS 相继冒了进去。到 80 年中期，各种衍生零碎被 Unix 发行厂商退出新性能，越来越个性化。使软件在 OS 之间互相移植变得越来越艰难，这重大违反了 Unix 哲学：”Choose portability over efficiency.“。于是 IEEE 为了拨乱反正，开始插手制订基于 Unix 的规范，涵盖网络、线程、文件 IO 以及 C 语言接口等，甚至包含开关机流程，规范定义了整个操作系统，由自由软件静止精神领袖 Richard Stallman 命名为 POSIX。

Linus 在《Just for Fun》中提到当年因为没有获取 POSIX 规范的渠道，简直齐全是照着 Sun 公司的 Unix 手册在写 Linux，因而很多 Unix 程序也能轻松迁徙到 Linux。另外 Microsoft 为了拉新也跟风推出了 POSIX-“compliant 零碎 Windows NT，嵌入到内核中。帮忙 Win10 推出了 WSL，1.0 版本即能无需编译、原生运行 Linux 利用。

libc

POSIX 通过 C 语言申明了 零碎调用，C 语言也有本人的规范库，在历史倒退中两者逐步交融，前者或后者都能够用来称说 libc。以后 Linux 最风行的 libc 实现诞生于 GNU 打算 的 glibc。

glibc 蕴含零碎调用申明和 库函数(比方: strlen)，个别程序在被 GCC 或 clang 编译时会将库函数生成的对象文件动态链接到产物中，零碎调用则根据 POSIX 标准生成指定汇编代码。因此只依赖 glibc 的程序在 macOS 和 Linux 之间迁徙非常简单。

iOS 和 Android 都属于 unix-like 零碎，利用无奈做到源码移植的起因是在自家零碎封装了 XNU 和 AOSP。构建 APP 大量依赖了 POSIX 之外的 API，两者关系如下图：

应用源码装置像 Homebrew 这样的原生利用，须要装置 Xcode 开发者工具，因为其内置了 libc 和 Darwin 专属的零碎调用申明。

简直所有利用都通过 libc 实现零碎调用，包含 Node.js 和 Python3.x 等解释器。因为零碎调用有必要会切换到内核态的缘故，性能远低于一般函数。日常开发可应用 strace 或 dtruss 跟踪零碎调用。

POSIX 零碎横截面示意图:

printf 最终把后果写入 /dev/stdout 设施文件 中，零碎会将指令发送到对应驱动，在终端显示 ”hello world”。

C++ to Web

WebAssembly 设计之初就思考了 Web 的移植和性能问题，当初 LLVM backend 曾经能输入 WASM 格局的二进制汇编文件。Emscripten 集成了 LLVM clang 和 backend 把 C++ 转换成 WASM，Emscripten 工作流程:

LLVM IR 标准让混合编译变得更加容易，backend 标准化了穿插编译的输入输出，当初 Rust/Golang 都能较轻松地转换到 WASM。而 Emscripten 比 WASM 技术还要古老，1.37.3 版本后才反对 WASM，在 WASM 之前仅反对 asm.js 格局。除了 wasm 之外，还包含 glue 胶水代码，除了治理 wasm 生命周期，WebAssembly 从设计之初就无法访问浏览器环境，因而用 JS 实现了 POSIX 中的零碎调用 API。Emscripten 横截面示意图:

如图，除却模块生命周期治理代码外，灰色区域逻辑由胶水代码负责：

1. 零碎调用，Emscripten 会把 C++ 中依赖的零碎调用 API 替换成 JS 代码，如 printf 最终会执行到 console.log，外围胶水代码
2. 胶水接口，一些零碎调用能力也会通过 JavaScript 接口公开裸露到全局上下文 Module 中，例如 FS 文件系统
3. JS in C++，Emscripten 通过宏定义提供了在 C++ 中写 JS 代码的能力，编译后对应 JS 逻辑会放到胶水代码中

开箱

外观介绍

装置 Emscripten 须要先克隆 emsdk 到本地，内置 LLVM、Node.js、Python 以及 Java 等工具集，提供一个残缺的编译环境。emsdk 提供了主动 / 手动装置指定 emscripten-core/emscripten 版本的命令，后者囊括了构建脚本、胶水代码库以及测试用例和官网文档；Emscripten 版本指的也是它，更版频率大概 1~2 周，最新已达 3.1.27。

机身构造

为了保障环境对立，emsdk 还能够装置 / 查问 / 治理 python/node/llvm/musl 等依赖库，musl 是 Emscripten 应用的开源 libc。应用编译环境须要先执行 emsdk_env.sh，外部把各依赖的 /bin 门路增加到 $PATH 中。

装置好的 emscripten 内蕴含了胶水 JS 文件、C/C++ 库、以及测试用例。编译命令脚本 emcc/em++ 的编译选项定义在 settings.h 中，有 231 个配置项。include/emscripten.h 定义 Emscripten 独自提供的函数、宏定义以及类型别名，比方 emscripten_debugger，会调用 JS 的 debugger，从而疾速打断点调试。

疾速上手

通过测试用例学习某个库如何应用，查看生成的胶水代码能够单步调试剖析外部流程逻辑，C/C++ 也一样，独自开启 source-map 后还原库和业务代码：

开机启动

应用编译选项 -sUSE_PTHREADS 可开启多线程能力反对，PThread 即 POSIX Thread。编译产物蕴含 wasm 模块、wasm.js 胶水代码和 worker.js 线程 (worker) 启动脚本。独自 wasm 模块只用 WebAssembly.instantiate 就能实现初始化，但无奈享受到胶水代码的 POSIX API 实现和其它便捷函数。

脚本模式下 wasm.js 作为 script 引入，自执行会触发初始化逻辑，通过回调告诉内部 init 实现。Emscripten 生命周期钩子、第三方插件逻辑等根本都能够用回调赋值和编译替换两种形式注入。加载运行残缺产物的流程如下：

图中仅代表代码在文件中自上而下的程序，与理论执行时序无关。如图，与原生利用中 main 函数作为利用执行的入口不同，WASM 中的 main 函数不影响程序的生命周期，其返回也不意味着 “WASM 程序 ” 终止。因此 Web 应用 WASM 模块并非内嵌了一个黑盒 APP，反而像是引入了一个 状态库，库中有个 main 函数在初始化阶段可选的调用，C/C++ 除了变量申明赋值无奈执行逻辑在函数体外。音讯循环利用迁到 WASM 可应用 emscripten_set_main_loop 模仿：

emscripten_set_main_loop 第二个参数示意循环周期，如果是 0 则应用 requestAnimationFrame。

run 函数

run 函数负责调用各种 pre/post 回调钩子，实现生成 WASM 实例后的初始化。机会有 wasm.js 自执行阶段和 removeRunDependency 移除完所有依赖。

所有内置依赖都会同步的生成到 wasm.js 中，比方同样是自执行的 createWasm 函数，函数入口会减少 wasm-instantiate 依赖，直到编译、实例化 WASM 模块才移除依赖(执行 run 函数)。还有动静库预载(如果有) preloadDylibs 和 IndexedDB 缓存同步 syncfs 等，这些依赖在自执行阶段被增加，全都实现再触发 run 函数，通过 onRuntimeInitialized 告知业务初始化完结。

pre/post-js

--pre-js=files 和 --post-js=files 两个编译选项注入代码到文件头 / 尾，比方应用 pre-js 能够拿到实在脚本开始执行工夫，防止下载和代码解析烦扰。Emscripten 构建脚本 emcc 会用宏定义和槽位匹配两种形式替换生成代码。

线程生命周期

除了在 C/C++ 中应用 POSIX 头文件 <pthread.h> 里的 API pthread_create，还能够在编译时减少 -sPTHREAD_POOL_SIZE=n 参数，使胶水代码 wasm.js 于自执行阶段创立 n 条线程。线程创立流程如下：

如果 unsedWorkers 池中无闲暇线程，则新建 worker：

1. 发送 load 事件，带上曾经构建好的 [WebAssembly.Memory](https://developer.mozilla.org/en-US/docs/WebAssembly/JavaScript_interface/Memory){shared: true}、WebAssembly.Module 以及胶水代码 wasm.js
2. worker.js 利用 wasm.js 同步地创立 WASM 实例，返回 loaded 事件给主线程
3. 主线程发送 run 事件，worker 接管后开始初始化线程，记录线程启动工夫和调配堆栈上上限

销毁线程分为回收和齐全杀死两种，回收开释线程内存，worker 可留作下一次复用，节约启动工夫；杀死则彻底销毁 worker。

拆机

产物剖析

残缺的 Emscripten 产物蕴含三个文件：

1. .wasm 二进制文件，C/C++ 逻辑转译产物
2. wasm.js，负责开启启动，还有承载了 POSIX 在 Web 上的模仿实现
3. worker.js，PThread 的 worker 实现，建设和主线程绑定关系后交给 wasm.js 启动

转译 C/C++

Emscripten 外部应用 clang 编译 C/C++ 代码，被编译的代码分为业务工程代码、外部框架代码和动态库三局部。简单的业务工程可能须要由 make 或 Ninja 等规定工具。emcc 在交给 clang 之前，会把 musl 中 POSIX 零碎申明以 文件粒度 替换成 Emscripten 实现，应用 .py 脚本拼接硬编码，生成 Ninja 规定，领导 链接程序：

这些文件里的函数依靠 Web 能力，最终将调用 JS 实现。以 POSIX 杀死线程 pthread_kill API 举例，通过脚本实现 POSIX 库文件替换，前后区别：

如图，__pthread_kill_js 是一个 ” 内部实现 ” 函数，C/C++ 只有函数申明，编译到 WASM 将生成一条 import 指令，申明实例化 WASM 须要传入的 JS 函数。import 指令是一个二级构造，其它编译工具默认一级名称为 env。Emscripten 共实现了 82 个替换文件。

musl libc 中没有的函数，须要引入 libpng 和 libogg 等第三方库，减少命令行参数 -sUSE_LIBPNG 给 emcc，emcc 从 Emscripten 依赖动态库列表 下载动态库 .a，链接阶段 wasm-ld 把 .a 放到命令参数 靠右 地位，业务工程被链接的 .o 靠左，链接器 wasm-ld 从左到右解析文件，遇到函数申明就退出符号表，发现定义则删除。遍历一轮符号表不为空，报出谬误 xxx 函数没找到。

clang 编译生成的 .o 对象文件和第三方 .a 动态库，甚至 .so 动静库都听从 ELF 标准。不同的是 .o 和 .a 比 IR 更靠近源代码，根本算是二进制的源码，能够把几个 .o 退出打包进另一个 .a。动静库与平台绑定，不参加程序本体的编译、链接流程。

胶水 JS

wasm.js 和 worker.js 来自于多份 ” 预处理 JS” 经 parseTools.js 解析，按行匹配代码，检测到宏执行对应操作，相当于一个模板引擎。

如图：

1. 断言宏，callMain 执行时如果开启了断言(settings.ASSERTIONS = 1)，保留 #3 代码。运行阶段发现 run 依赖没清空则终止运行并报错。
2. include 宏，用 Fetch.js 内容替换以后地位。

预处理完的代码会交给 eval 执行 mergeInto，将函数定义收集到对立对象 “Module”，通过 ” 二次预处理 ” 后，输入到 wasm.js，挂载到 Module['asm']，在实例化 WASM 时传给它。”__sig” 会生成一份 ” 函数定义 ”，遇到 C++ 函数重载，要求签名统一。

运行时动静生成函数可通过 WebAssembly.Table 实现，原理是 JS 和 C++ 侧把各自的函数对象、函数指针绑定到 Table 指定 index 中，Table 实现封装。

因为 WASM 汇编指令函数申明的 参数列表 / 返回值类型 只能是整数或浮点，传递简单数据时，只能当指针用：

Emscripten 提供了 WebAssembly.Memory.buffer 的多种 HEAP View。在 取对应类型值得把指针按 item 长度整除。

构造体传递时，JS 了解 C/C++ 对象模型十分艰难，还好 Emscripten 编译阶段提供了偏移计算语法：

如图，fetchXHR 是定义在 library_fetch.js 的函数，为 C/C++ 提供网络能力反对。调用 fetchXHR 前，C/C++ 侧先申请一段 emscripten_fetch_t 构造体对应大小的内存，拿到内存首字节指针，给偏移量为 ”url” 赋值。JS 则按雷同偏移取值。

文件系统

Emscripten 能够在浏览器和 Node.js 运行，编译到 Node.js 应用自带的 fs API；浏览器出于平安思考，无法访问宿主文件系统。而且 JS 只能异步读取文件 buffer，而 C/C++ 应用 POSIX API 同步读取，因而 Emscripten 提供了一套虚构文件系统的 POSIX 实现，C/C++ 应用这套 FS 可间接 include fstream、stdio.h 这两个头文件。

MEMFS

全称 Memory FS，应用纯 JS 模仿了一套文件系统，文件本体作为 buffer 在内存里（WebAssembly.Memory 外）；因而子线程读写文件须要代理到主线程：

如图，Emscripten 许多 POSIX 能力都会代理到主线程执行，线程读取文件，创立代理工作投递到主线程执行，并陷入自旋锁，直到工作实现后解开，因而十分依赖主线程执行能力。如果主线程忙碌，worker 性能将会一起被连累。

wasmFS

随着 wasmfs 的推动与 OPFS 规范的上线，这个问题将失去很大的改善，它将文件数治理移到了 C ++ 层，从而充分利用 SharedArrayBuffer 的跨线程能力，防止了所有操作代理到主线程的问题。