JS代码和WebAssembly运行效率问题

一、JS引擎运行过程

该图显示了 JS 引擎运行程序花费的时间。

• Parsing ：将源码转换成解释器可以运行的东西所用的时间。
• Compiling + optimizing：基础编译和优化编译上的时间。有一些优化编译的工作不在主线程，所以这里并不包括这些时间。
• Re-optimizing：当预先编译优化的代码不能被优化的情况下，JIT 将这些代码重新优化，如果不能重新优化那么久丢给基础编译去做。这个过程叫做重新优化。
• Execution：执行代码的时间
• Garbage collection：清理内存的时间

二、在运行过程中WebAssembly优于JS的原因

1、 请求

WebAssembly体积更小：下载执行与 JavaScript 等效的 WebAssembly 文件需要更少的时间，因为它的体积更小。

WebAssembly 设计的体积更小，可以以二进制形式表示。即使使用 gzip 压缩的 JavaScript文件很小，但 WebAssembly 中的等效代码可能更小。所以说，下载资源的时间会更少。在网速慢的情况下更能显示出效果来。

2、解析

JavaScript 源码一旦被下载到浏览器，源将被解析为抽象语法树（AST）。通常浏览器解析源码是懒惰的，浏览器首先会解析他们真正需要的东西，没有及时被调用的函数只会被创建成存根。在这个过程中，AST被转换为该 JS 引擎的中