WebAssembly初体验

上篇介绍了WebAssembly的前生今世，这篇准备写几个例子试玩一下。

1.安装Emscripten

首先肯定是先安装Emscripten，这是一个toolchain，可以把C/C++代码编译成asm.js和WASM字节码。内部其实分为三部分：

• 调用编译器前端Clang把C/C++代码编译成LLVM字节码
• 调用编译器后端Fastcomp把LLVM字节码编译成asm.js
• 调用Binaryen的asm2wasm把asm.js转换成WASM字节码
  
  Emscripten的具体安装步骤如下：

# 下载Emscripten源码
git clone https://github.com/juj/emsdk.git
cd emsdk

# 安装最新版本
./emsdk install latest

# 使用最新版本
./emsdk activate latest

# 添加环境变量
source ./emsdk_env.sh

2.HelloWorld

写个HelloWorld：

#include <stdio.h>

int main(int argc, char** argv) {
    printf("Hello World!\n");
    return 0;
}

用下面的命令编译：

注：最新版本的Emscripten默认就会生成.wasm，不需要像以前那样指定“-s WASM=1”了

emcc hello.c -o index.html

编译后的目录文件结构如下：

需要注意的是，生成的index.html直接双击打开是无法运行的，必须运行一个本地的HTTP服务器。通过下面的命令安装http-server：

npm install http-server -g

然后，在当前目录下直接运行HTTP服务器：

最后通过URL访问该网页：http://127.0.0.1:8080/index.html

当然，如果你想把网页搞得更漂亮一点，还可以自定义HTML模版，在emsdk目录中有一个最小版本的HTML模版shell_minimal.html，可以在这个基础上进行修改，然后用下面的命令编译：

emcc hello.c -o index.html --shell-file shell_minimal.html

3.C代码调用Javascript

C代码里可以通过Emscripten中的EM_ASM这个宏调用Javascript代码，注意Javascript代码要放进大括号里。我们把上面的代码改一改，让它蹦一个弹窗：

#include <stdio.h>
#include <emscripten.h>

int main(int argc, char** argv) {
    EM_ASM({ alert("Hello!"); });
    return