WebAssembly分享

2018-06-13 15:37:32 浏览数 (1)

什么是WebAssemblely

WebAssembly是一种运行在现代网络浏览器中的新型代码并且提供新的性能特性和效果。它设计的目的不是为了手写代码而是为诸如C、C 和Rust等低级源语言提供一个高效的编译目标。 对于网络平台而言，这具有巨大的意义——这为客户端app提供了一种在网络平台以接近本地速度的方式运行多种语言编写的代码的方式；在这之前，客户端app是不可能做到的。

目标

  • 快速，高效，可移植--通过利用通用的硬件功能，可以在不同的平台上以接近原生代码执行的速度执行WebAssembly代码。
  • 可读性和可调式性--WebAssembly是一种低级汇编语言，但它具有人工可读的文本格式（规范仍在定案中），允许手动编写，查看和调试代码。
  • 保持安全--WebAssembly被指定为在安全的沙盒执行环境中运行。像其他网页代码一样，它会强制执行浏览器的相同来源和权限策略。
  • 不破坏网络--WebAssembly的设计可以很好地与其他网络技术搭配使用，并保持向后兼容性。

通俗的来讲，WebAssembly就是一种新的字节码格式，将其他代码变成底层的机器码，让代码运行的更快 什么是WebAssembly

“沙盒”技术与主动防御技术原理截然不同。主动防御是发现程序有可疑行为时立即拦截并终止运行。“沙盒”技术则是发现可疑行为后让程序继续运行，当发现的确是病毒时才会终止。“沙盒”技术的实践运用流程是：让疑似病毒文件的可疑行为在虚拟的“沙盒”里充分表演，“沙盒”会记下它的每一个动作；当疑似病毒充分暴露了其病毒属性后，“沙盒”就会执行“回滚”机制：将病毒的痕迹和动作抹去，恢复系统到正常状态。

WebAssembly是如何工作的？

1.Emscripten首先将C / C 提供给LLVM--一个成熟的开源C / C 编译器工具链。 2.Emscripten将LLVM的编译结果转换为.wasm二进制文件。 3.WebAssembly本身不能直接访问DOM; 它只能调用JavaScript，传入整数和浮点基元数据类型。因此，要访问任何Web API，WebAssembly需要调用JavaScript，然后进行Web API调用。因此，Emscripten创建了实现此目的所需的HTML和JavaScript 胶水代码。

（1） LLVM（Low Level Virtual Machine），LLVM 核心库提供了与编译器相关的支持，可以作为多种语言编译器的后台来使用。能够进行程序语言的编译期优化、链接优化、在线编译优化、代码生成。LLVM的项目是一个模块化和可重复使用的编译器和工具技术的集合。提供一个现代化的，基于SSA的编译策略能够同时支持静态和动态的任意编程语言的编译目标。 （2） 胶接代码也被称为绑定代码，是用于连接不兼容软件组件的自定义编程语言。 胶接代码可以用与它连接的代码相同的语言编写，但是它通常是用专门的解释脚本语言编写的，用于连接称为Glue语言的系统组件。流行的胶水语言包括AppleScript、JavaScript、Perl、PHP、Python、Ruby、VBScript和PowerShell。 Emscripten实现流行的C / C 库，如SDL，OpenGL，OpenAL和POSIX的一部分。这些库是根据Web API实现的，因此每个库都需要一些JavaScript粘合代码来将WebAssembly连接到底层Web API。 因此部分胶水代码正在实现C / C 代码使用的各个库的功能。glue代码还包含调用上述WebAssembly JavaScript API以获取，加载和运行.wasm文件的逻辑。

怎么使用

1.安装Git，CMake，主机系统编译器，Python环境。 2.下载或者编译工具链 一个预编译的工具链可以从github中下载

代码语言：javascript复制
$ git clone https://github.com/juj/emsdk.git
$ cd emsdk
$ ./emsdk install latest
$ ./emsdk activate latest

3.进入Emscripten编译器环境

代码语言：javascript复制
$ source ./emsdk_env.sh --build=Release

4.编译运行一个简单的程序 我们现在有了完整的工具链能够来编译一个简单的程序到WebAssembly中，以下是一些注意事项

  • 必须传递连接标志-s WASM=1在emcc后（否则默认的emcc为执行asm.js
  • 如果我们想Emscripten生成一个HTML页面来运行程序，除了Wasm库和JS包裹层，要指明一个输出一个以.html结尾的文件名
  • 最后，我们不能直接打开这个HTML文件在浏览器中，因为跨域请求在file协议中不支持，我们需要在HTTP中运行 以下的命令行能创建一个“hello world”程序然后编译它
代码语言：javascript复制
$ mkdir hello
$ cd hello
$ cat << EOF > hello.c
#include <stdio.h>
int main(int argc, char ** argv) {
  printf("Hello, world!n");
}
EOF
$ emcc hello.c -s WASM=1 -o hello.html

为了在HTTP中运行，可以用Emscripten SDK emrun来建立一个本地服务器

代码语言：javascript复制
$ emrun filename.html --no_browser --port 8080

Emscripten编译原理

Emscripten是一个开源的JS的LLVM（低级虚拟机Low Level Virtual Machine)编译器，能够使你

  • 编译C和C 代码到js中
  • 编译任何能够被转换成LLVM字节码的其他代码到JS中
  • 在其他语言环境下直接运行编译后的JS 使用Emscripten，任何可移植的C或C 代码可以编译成JavaScript,从高性能游戏需要渲染图形,播放声音,和负载和处理文件

Emscripten工具链

Emcc使用Clang（一个C/C 的编译器，其他使用LLVM的编程语言用它作为后端）将C/ c 文件转换为LLVM字节码。 Fastcomp (Emscripten的编译器核心-一个LLVM后端)，将字节码编译为JavaScript。输出的js能够被node.js执行，HTML文件以浏览器执行 Emscripten SDK (emsdk) 被用来管理多个SDK和工具，并指定当前用于编译代码的特定SDK/工具集(活动工具/SDK)。 Emsdk将“active”配置写入到编译器配置文件(. Emscripten)。这个文件被emcc使用，以获得当前正确的构建工具链。 官网上的详情

怎样运行

WebAssembly目前必须通过JS来加载和编译，基础的加载分为以下3个步骤

  • 将获取的.wasm字节变成一个typed array或一个ArrayBuffer
  • 将这个字节编译成一个WebAssembly.Moudle
  • 将WebAssembly.Module用import 实例化以获取可调用的export 知乎 JIT 博客 在线例子

为什么它的效率快

参考链接

总结

1.什么是WebAssembly 实际上就是一堆二进制代码 2.怎么编译的 通过emscripten这个工具将其他语言的代码编程wasm模块，它是由二进制代码组成 3.怎么运行 将二进制的模块实例化然后导出

参考链接： WebAssembly官网 Emscripten官网 MDN

汇编语言

0 人点赞