WebAssembly是一种新的二进制格式,它可以方便地将C/C++等静态语言的代码快速地“运行”在浏览器中,这一特性为前端密集计算场景提供了无限可能。不仅如此,通过WebAssembly技术,我们还可以将基于Unity等游戏引擎开发的大型游戏快速地移植到Web端。WebAssembly技术现在已经被计划设计成W3C的标准,众多浏览器厂商已经提供了对其MVP版本标准的支持。在Google I/O 2017大会上,Google首次针对WebAssembly技术进行了公开演讲和推广,其Post-MVP版本标准更是对诸如DOM操作、多线程和GC等特性提供了支持。WebAssembly所带来的Web技术变革势不可挡。本书力求从一些简单的实践入手,深入理论,到复杂的具有实际业务价值的综合实践,深入浅出地介绍Wasm技术发展至今,其背后所涉及的各种底层设计原理与实现、相关工具链以及未来发展方向等多方面内容。本书内容包括:WebAssembly技术的发展历程,从PNaCl到ASM.js再到WebAssembly,以及这些技术的基本应用方法与性能对比;WebAssembly的标准上层API、底层堆栈机的设计原理,以及对MVP标准理论的深入解读;与WebAssembly标准相关的进阶内容,如单指令多数据流(SIMD)、动态链接(DL)等;LLVM工具链与WAT可读文本格式的相关内容;基于Emscripten工具链开发WebAssembly应用的基本流程,以及工具链的一些基本常用功能和特性;基于Emscripten工具链实现C/C++语言动态关系绑定技术;Emscripten工具链所提供的一些如WebGL支持、虚拟文件系统、应用优化以及HTML 5事件系统等高级应用特性;构建一个具有实际业务价值的WebAssembly应用,现阶段Wasm生态的发展情况,以及在Post-MVP标准中制订的一些WebAssembly未来发展规划。本书的目标读者为Web前端开发人员、C/C++开发人员和对WebAssembly技术感兴趣的人员。
于航,现就职于阿里巴巴 / 饿了么事业部(BU),资深前端工程师,FreeCodeCamp(FCC) China 上海社区负责人,QCon(2017)上海前端专场讲师。2016 年开始研究 WebAssembly 技术,2017 年加入 WebAssembly 中国社区,同年加入官方WCG(W3C Community Group),定期参与 WCG组织的各种线上视频研讨会议,在跟进 WebAssembly 最新发展的同时,也为 WebAssembly 的标准化提出自己的建议和意见。生活中喜欢弹钢琴、演讲与分享。主要技术研究方向为Web前端与基础设施架构、WebAssembly、LLVM以及编译器等相关领域。
目 录
第1 章 漫谈WebAssembly 发展史 1
1.1 JavaScript 的发展和弊端 1
1.1.1 快速发展与基准测试 1
1.1.2 Web 新时代与不断挑战 8
1.1.3 无法跨越的“阻碍” 11
1.1.4 Chrome V8 引擎链路 17
1.2 曾经尝试——ASM.js 与PNaCl 28
1.2.1 失落的ASM.js 28
1.2.2 古老的NaCl 与PNaCl 42
1.3 新的可能——WebAssembly 57
1.3.1 改变与颠覆 57
1.3.2 一路向前,WCG 与WWG 85
第2 章 WebAssembly 核心原理(基于MVP 标准) 90
2.1 应用与标准Web 接口 90
2.1.1 编译与初始化 90
2.1.2 验证模块 106
2.1.3 遇到错误 106
2.1.4 内存分配 108
2.1.5 表 112
2.2 深入设计模型——堆栈机 118
2.2.1 堆栈式虚拟机 119
2.2.2 逆波兰表达式 125
2.2.3 Shunting-yard 算法 126
2.2.4 标签与跳转 130
2.2.5 条件语句 135
2.2.6 子程序调用 137
2.2.7 变量 138
2.2.8 栈帧 139
2.2.9 堆 140
2.3 类型检查 141
2.3.1 数据指令类型 142
2.3.2 基本流程控制 144
2.3.3 基于表达式的控制流 149
2.3.4 类型堆栈的一致性 151
2.3.5 不可达代码 155
2.4 二进制编码 156
2.4.1 字节序——大端模式与小端模式 157
2.4.2 基于LEB-128 的整数编码 161
2.4.3 基于IEEE-754—2008 的浮点数编码 163
2.4.4 基于UTF-8 的字符串编码 167
2.4.5 模块数据类型 168
2.4.6 虚拟指令与编码 169
2.4.7 类型构造符 174
2.5 模块 175
2.5.1 段 175
2.5.2 索引空间 185
2.5.3 二进制原型结构 186
2.6 内存结构 196
2.6.1 操作运算符 197
2.6.2 寻址 197
2.6.3 对齐 198
2.6.4 溢出与调整 203
第3 章 动态链接与SIMD(基于MVP 标准) 204
3.1 动态链接(Dynamic Linking) 204
3.1.1 ELF 206
3.1.2 符号重定向(Symbol Relocation) 212
3.1.3 GOT(Global Offset Table,全局偏移表) 225
3.1.4 PLT(Procedure Lookup Table,过程查询表) 229
3.1.5 基于表的Wasm 模块动态链接 233
3.2 单指令多数据流(SIMD) 237
3.2.1 SIMD 应用 239
3.2.2 并行与并发 243
3.2.3 费林分类法 244
3.2.4 SIMD.js & TC39 246
3.2.5 WebAssembly 上的SIMD 扩展 248
第4 章 深入LLVM 与WAT 250
4.1 LLVM——底层虚拟机 250
4.1.1 传统的编译器架构 251
4.1.2 LLVM 中间表示层 252
4.1.3 基于LLVM 的编译器架构 254
4.1.4 LLVM 优化策略 256
4.1.5 LLVM 命令行工具 261
4.1.6 WebAssembly 与LLVM 268
4.2 基于LLVM 定义新的编程语言 272
4.2.1 图灵完备与DSL 276
4.2.2 简易词法分析器 280
4.2.3 RDP 与OPP 算法 287
4.2.4 AST(抽象语法树) 295
4.2.5 简易语法分析器 296
4.2.6 生成LLVM-IR 代码 303
4.2.7 链接优化器 307
4.2.8 编译到目标代码 308
4.2.9 整合I/O 交互层 312
4.3 WAT 315
4.3.1 S-表达式 316
4.3.2 WAT/Wasm 与Binary-AST 318
4.3.3 其他与设计原则 320
第5 章 Emscripten 基础应用 321
5.1 利器——Emscripten 工具链 321
5.1.1 Emscripten 发展历史 321
5.1.2 Emscripten 组成结构 323
5.1.3 Emscripten 下载、安装与配置 325
5.1.4 运行测试套件 329
5.1.5 编译到ASM.js 330
5.2 连接C/C++与WebAssembly 332
5.2.1 构建类型 333
5.2.2 Emscripten 运行时环境 341
5.2.3 在JavaScript 代码中调用C/C++函数 350
5.2.4 在C/C++代码中调用JavaScript 函数 362
第6 章 基于Emscripten 的语言关系绑定 381
6.1 基于Embind 实现关系绑定 383
6.1.1 简单类 388
6.1.2 数组与对象类型 390
6.1.3 高级类元素 392
6.1.4 重载函数 406
6.1.5 枚举类型 407
6.1.6 基本类型 408
6.1.7 容器类型 410
6.1.8 转译JavaScript 代码 412
6.1.9 内存视图 415
6.2 基于WebIDL 实现关系绑定 416
6.2.1 指针、引用和值类型 419
6.2.2 类成员变量 421
6.2.3 常量“const”关键字 422
6.2.4 命名空间 423
6.2.5 运算符重载 424
6.2.6 枚举类型 425
6.2.7 接口类 428
6.2.8 原始指针、空指针与void 指针 430
6.2.9 默认类型转换 433
第7 章 探索Emscripten 高级特性 436
7.1 加入优化流程 436
7.1.1 使用编译器代码优化策略 441
7.1.2 使用GCC 压缩代码 443
7.1.3 使用IndexedDB 缓存模块对象 445
7.1.4 其他优化参数 452
7.2 使用标准库与文件系统 453
7.2.1 使用基于musl 和libc++的标准库 454
7.2.2 虚拟文件系统结构 457
7.2.3 打包初始化文件 459
7.2.4 基本文件系统操作 460
7.2.5 懒加载 469
7.2.6 Fetch API 473
7.3 处理浏览器事件 478
7.3.1 事件注册函数 479
7.3.2 事件回调函数 480
7.3.3 通用类型与返回值类型 481
7.3.4 常用事件 483
7.4 基于EGL、OpenGL、SDL 和OpenAL 的多媒体处理. 486
7.4.1 使用EGL 与OpenGL 处理图形 487
7.4.2 使用SDL 处理图形 493
7.4.3 使用OpenAL 处理音频 496
7.5 调试WebAssembly 应用 499
7.5.1 编译器的调试信息 499
7.5.2 使用调试模式 501
7.5.3 手动跟踪 502
7.5.4 其他常用编译器调试选项 504
第8 章 WebAssembly 综合实践、发展与未来 505
8.1 DIP 综合实践应用 505
8.1.1 应用描述 505
8.1.2 滤镜与卷积 506
8.1.3 基本组件类型与架构 510
8.1.4 编写基本页面骨架(HTML 与CSS) 511
8.1.5 编写核心卷积函数(C++) 512
8.1.6 编写主渲染循环与“胶水”代码(JavaScript) 514
8.1.7 使用Emscripten 编译并运行应用 519
8.1.8 性能对比 520
8.2 WebAssembly 常用工具集 521
8.2.1 Cheerp 521
8.2.2 Webpack 4 523
8.2.3 Go 和Rust 的WebAssembly 实践 525
8.2.4 Binaryen 528
8.2.5 WasmFiddle 529
8.2.6 Wabt 530
8.2.7 AssemblyScript 530
8.3 WebAssembly 未来草案 530
8.3.1 GC(垃圾回收) 531
8.3.2 Multi-Thread(多线程)与原子操作 531
8.3.3 异常处理 531
8.3.4 多返回值扩展 531
8.3.5 ES 模块 531
8.3.6 尾递归 532
8.3.7 BigInts 的双向支持 532
8.3.8 自定义注释语法 532