*丁尔男

WebAssembly技术专家，WebAssembly的先驱者和布道者，率先将WebAssembly技术引入实际工程中，合著有《WebAssembly标准入门》。

长期从事三维地理信息系统软件开发工作，现任武汉航天远景科技股份有限公司应用技术总监，领导开发了3DMatrix系列产品及实景三维应用整体解决方案。

*柴树杉

WebAssembly技术专家，WebAssembly的先驱者和布道者，目前就职于蚂蚁集团，从事云原生配置编程语言的设计和研发工作，合著有《WebAssembly标准入门》。

Go语言技术专家，Go语言的贡献者，著有《Go语言高级编程》 。

1、两位作者均是国内WebAssembly的先驱者、布道者、技术专家，在社区里有较大的影响力。
2、本书讲解了基于C/C++/JavaScript等高级语言开发WebAssembly应用的技术和方法，包含大量案例。
3、本书详细讲解了WebAssembly的关键技术和原理，以及Emscripten和WASI等工具的使用方法。

【为什么要写这本书】

WebAssembly是新一代Web虚拟机标准，可以让用各种语言编写的代码都能以接近原生的速度在Web中运行。比如，C/C++代码可以通过Emscripten工具链编译为wasm二进制文件，进而导入网页中供JavaScript调用。这意味着使用C/C++编写的程序可以直接在网页中运行，而Rust语言更是内置了对WebAssembly的支持。

作为一种新兴技术，目前WebAssembly的相关技术资料尚不丰富，再加上WebAssembly的开发涉及多种语言和开发环境，导致其工程化门槛较高。作为国内最早的一批WebAssembly开发者，我们非常希望能分享相关知识和方法给读者。

在2018年，借WebAssembly草案1.0发布的契机，我们出版了《WebAssembly标准入门》一书。但《WebAssembly标准入门》重点讨论的是WebAssembly技术本身，花了大量篇幅讲述虚拟机的底层结构、汇编语言、模块的二进制格式等内容，并未过多讨论如何使用高级语言开发WebAssembly应用。因此在2018年年底，我们重新思考了如何用Emscripten编写友好的Web应用这个问题，并形成了本书的前半部分。

2019年年底，机械工业出版社发出约稿，其时WASI技术已经诞生，我们希望能在书中包含WASI以及Rust等新的技术内容，最终打造了本书目前的结构。本书从Emscripten的基本使用开始，介绍了用C/C++开发WebAssembly模块的方法，并且以作者在实际工程项目中获取的一手经验为基础，提出了一些一般性的设计原则和技术框架，同时讨论了如何用Rust语言与C/C++语言混合开发WebAssembly应用。

【本书理念】

我们认为，一个理想的面向Web的C/C++/Rust工程应该对编译目标不敏感，它既可以被编译为本地代码直接运行，也可以被编译为WebAssembly在网页中运行，切换二者只需要更改运行环境，这样便可充分利用现有IDE环境强大的开发、调试、分析、测试等功能，提高工程质量、降低开发成本。但WebAssembly的运行环境毕竟与本地环境有着巨大的差异，因此为了达到上述理想目标，从整体框架到接口设计甚至到函数间的数据交换层面都必须充分考虑Web环境的特点（或者说限制）。这也正是本书所贯彻的“WebAssembly友好”的内涵所在。

【读者对象】

本书可为以下两类读者带来直接收益：

以C/C++/Rust为主力开发语言，并且希望介入前端领域的开发者；

希望借助高性能的C/C++/Rust库解决前端性能问题的JavaScript开发者。

【如何阅读本书】

本书旨在介绍如何使用C/C++/Rust语言开发实用的WebAssembly模块，要求读者具备基本的JavaScript和C/C++开发技能。本书主要分为以下三篇。

基础篇（第1章至第3章）：介绍了使用C/C++语言及Emscripten工具链开发WebAssembly模块的基本方法。

方法篇（第4章至第8章）：对Emscripten运行时、WebAssembly友好的一般性方法、网络I/O、并发执行、GUI及交互展开讨论。

前沿篇（第9章和第10章）：介绍了如何使用Rust语言开发WebAssembly模块和WASI应用。

【第一篇　基础篇】
第1章　认识WebAssembly2
11　WebAssembly的诞生背景2
12　Web的第4种语言3
13　本章小结4
第2章　Emscripten快速入门5
21　安装Emscripten5
211　使用emsdk命令行工具安装Emscripten5
212　在Docker环境中安装Emscripten7
213　校验安装8
22　你好，世界！8
221　生成wasm文件8
222　运行9
223　使用Emscripten生成测试页面11
23　胶水代码初探12
231　WebAssembly汇编模块载入12
232　导出函数封装14
233　异步加载16
24　编译目标及编译流程17
241　编译目标的选择17
242　编译流程18
25　示例：放大镜特效19
251　模板程序19
252　静态的放大镜20
253　动态的放大镜21
26　本章小结24
第3章　C与JavaScript互操作25
31　JavaScript调用C函数25
311　定义函数导出宏25
312　在JavaScript中调用C导出函数27
32　JavaScript函数注入C环境30
321　C函数声明30
322　JavaScript实现C函数30
323　闭包限制及解决办法32
324　JavaScript函数注入C环境的优缺点33
33　单向透明的内存模型33
331　Modulebuffer34
332　ModuleHEAPX34
333　在JavaScript中访问C/C++环境内存35
34　JavaScript与C/C++交换数据37
341　参数及返回值37
342　通过内存交换数据39
343　在JavaScript中分配内存42
344　字符串43
35　EM_ASM系列宏44
351　EM_ASM44
352　EM_ASM_/EM_ASM_DOUBLE45
353　EM_ASM_INT_V/EM_ASM_DOUBLE_V46
36　emscripten_run_script()系列函数47
361　emscripten_run_script()47
362　emscripten_run_script_int()48
363　emscripten_run_script_string()49
37　ccall()/cwrap()50
371　ccall()51
372　cwrap()53
373　ccall()/cwrap()的潜在风险53
38　本章小结56

【第二篇　方法篇】
第4章　Emscripten运行时58
41　main()函数与生命周期58
42　消息循环61
421　emscripten_set_main_loop()61
422　消息循环的暂停、继续及终止63
43　文件系统65
431　Emscripten虚拟文件系统架构66
432　基于MEMFS的打包文件系统67
433　NODEFS文件系统71
434　IDBFS72
44　内存管理73
441　内存容量/栈容量73
442　可变内存74
443　内存分配器75
45　Module定制75
46　示例：人脸检测78
461　facedetect_cnn()函数78
462　facedetect_cnn()函数再封装79
463　读取图像并检测人脸81
464　基于SDL显示IplImage图像82
47　本章小结84
第5章　WebAssembly友好的一般性方法85
51　消息循环分离85
511　emscripten_set_main_loop()的不足85
512　在JavaScript中创建定时循环86
52　内存对齐88
521　asmjs88
522　wasm91
523　避免及检测未对齐的内存操作92
53　使用C接口导出C++对象93
54　C++对象生命周期管理97
541　引用计数97
542　AddRef()/Release()使用规则98
543　导出AddRef()/Release()100
55　使用C接口注入JavaScript对象103
551　创建JavaScript对象/ID表103
552　注入JavaScript对象的生命周期管理104
56　小心64位整型数107
561　WebAssembly原生支持int64108
562　导出函数包含int64108
563　注入函数包含int64110
57　文件系统的缺陷111
58　本章小结112
第6章　网络I/O113
61　XMLHttpRequest113
611　XMLHttpRequest对象使用简介113
612　XMLHttpRequest对象的C接口封装115
613　扩展回调处理116
62　WebSocket119
621　创建WebSocket测试服务120
622　在JavaScript中使用WebSocket121
623　WebSocket对象的C接口封装122
63　本章小结126
第7章　并发执行127
71　JavaScript中的并发模型127
72　在Worker中使用Emscripten129
73　pthread线程132
731　原子操作132
732　pthread示例134
733　在浏览器环境运行pthread示例136
74　本章小结137
第8章　GUI及交互138
81　Canvas138
82　鼠标事件141
83　键盘事件144
84　Life游戏145
841　Life简介146
842　设计要求146
843　Life游戏C代码146
844　Life游戏网页代码150
845　运行Life151
85　本章小结152

【第三篇　前沿篇】
第9章　Rust和WebAssembly154
91　Rust入门154
911　安装Rust开发环境154
912　你好，世界155
913　Cargo管理工程155
914　本地文档156
92　你好，WebAssembly157
921　安装WebAssembly开发环境157
922　打印“你好，WebAssembly”159
93　导入和导出函数159
931　导出main()函数159
932　导入宿主打印函数161
933　导出自定义函数162
94　打印命令行参数163
941　打印字符串163
942　准备导入env_print_str()函数164
943　向Rust传入字符串165
944　命令行参数封装168
945　传入命令行参数170
95　no_std171
951　输出文件的大小171
952　通过no_std裁剪标准172
953　库173
96　嵌入C代码174