JavaScript深入浅出第4课：V8引擎是如何工作的？

摘要： 性能彪悍的v8引擎。

《javascript深入浅出》系列：

• javascript深入浅出第1课：箭头函数中的this究竟是什么鬼？
• javascript深入浅出第2课：函数是一等公民是什么意思呢？
• javascript深入浅出第3课：什么是垃圾回收算法？
• javascript深入浅出第4课：v8是如何工作的？

最近，javascript生态系统又多了2个非常硬核的项目。

大神fabrice bellard发布了一个新的js引擎quickjs，可以将javascript源码转换为c语言代码，然后再使用系统编译器(gcc或者clang)生成可执行文件。

facebook为react native开发了新的js引擎hermes，用于优化安卓端的性能。它可以在构建app的时候将javascript源码编译为bytecode，从而减少apk大小、减少内存使用，提高app启动速度。

作为javascript程序员，只有极少数人有机会和能力去实现一个js引擎，但是理解js引擎还是很有必要的。本文将介绍一下v8引擎的原理，希望可以给大家一些帮助。

javascript引擎

我们写的javascript代码直接交给浏览器或者node执行时，底层的cpu是不认识的，也没法执行。cpu只认识自己的指令集，指令集对应的是汇编代码。写汇编代码是一件很痛苦的事情，比如，我们要计算n阶乘的话，只需要7行的递归函数：

function factorial(n) {
    if (n === 1) {
        return 1;
    } else {
        return n * factorial(n - 1);
    }
}

代码逻辑也非常清晰，与阶乘数的学定义完美吻合，哪怕不会写代码的人也能看懂。

但是，如果使用汇编语言来写n阶乘的话，要300+行代码n-factorial.s：

这个n阶乘的汇编代码是我大学时期写的，已经是n年前的事情了，它需要处理10进制与2进制的转换，需要使用多个字节保存大整数，最多可以计算大概500左右的n阶乘。

还有一点，不同类型的cpu的指令集是不一样的，那就意味着得给每一种cpu重写汇编代码，这就很崩溃了。。。

还好，javascirpt引擎可以将js代码编译为不同cpu(intel, arm以及mips等)对应的汇编代码，这样我们才不要去翻阅每个cpu的指令集手册。当然，javascript引擎的工作也不只是编译代码，它还要负责执行代码、分配内存以及。

虽然浏览器非常多，但是主流的javascirpt引擎其实很少，毕竟开发一个javascript引擎是一件非常复杂的事情。比较出名的js引擎有这些：

• v8 (google)
• spidermonkey (mozilla)
• javascriptcore (apple)
• chakra (microsoft)
• iot：、jerryscript

还有，最近发布quickjs与hermes也是js引擎，它们都超越了浏览器范畴，atwood's law再次得到了证明：

any application that can be written in javascript, will eventually be written in javascript.

v8：强大的javascript引擎

在为数不多javascript引擎中，v8无疑是最流行的，chrome与node.js都使用了v8引擎，chrome的市场占有率高达60%，而node.js是js后端编程的事实标准。国内的众多浏览器，其实都是基于chromium浏览器开发，而chromium相当于开源版本的chrome，自然也是基于v8引擎的。神奇的是，就连浏览器界的独树一帜的microsoft也投靠了chromium阵营。另外，electron是基于node.js与chromium开发桌面应用，也是基于v8的。

v8引擎是2008年发布的，它的命名灵感来自超级性能车的v8引擎，敢于这样命名确实需要一些实力，它性能确实一直在稳步提高，下面是使用speedometer benchmark的测试结果：

v8在工业界已经非常成功了，同时它还获得了学术界的肯定，拿到了acm sigplan的programming languages software award：

v8's success is in large part due to the efficient machine code it generates.
because javascript is a highly dynamic object-oriented language, many experts believed that this level of performance could not be achieved.
v8's performance breakthrough has had a major impact on the adoption of javascript, which is nowadays used on the browser, the server, and probably tomorrow on the small devices of the internet-of-things.

javascript是一门动态类型语言，这会给编译器增加很大难度，因此专家们觉得它的性能很难提高，但是v8居然做到了，生成了非常高效的machine code(其实是汇编代码)，这使得js可以应用在各个领域，比如web、app、桌面端、服务端以及iot。

严格来讲，v8所生成的代码是汇编代码而非机器代码，但是v8相关的文档、博客以及其他资料都把v8生成的代码称作machine code。汇编代码与机器代码很多是一一对应的，也很容易互相转换，这也是反编译的原理，因此他们把v8生成的代码称为machine code也未尝不可，但是并不严谨。

v8引擎的内部结构

v8是一个非常复杂的项目，使用cloc统计可知，它竟然有超过100万行c++代码。

v8由许多子模块构成，其中这4个模块是最重要的：

• parser：负责将javascript源码转换为abstract syntax tree (ast)
• ignition：interpreter，即解释器，负责将ast转换为bytecode，解释执行bytecode；同时收集turbofan优化编译所需的信息，比如函数参数的类型；
• turbofan：compiler，即编译器，利用ignitio所收集的类型信息，将bytecode转换为优化的汇编代码；
• orinoco：garbage collector，模块，负责将程序不再需要的内存空间回收；

其中，parser，ignition以及turbofan可以将js源码编译为汇编代码，其流程图如下：

简单地说，parser将js源码转换为ast，然后ignition将ast转换为bytecode，最后turbofan将bytecode转换为经过优化的machine code(实际上是汇编代码)。

• 如果函数没有被调用，则v8不会去编译它。
• 如果函数只被调用1次，则ignition将其编译bytecode就直接解释执行了。turbofan不会进行优化编译，因为它需要ignition收集函数执行时的类型信息。这就要求函数至少需要执行1次，turbofan才有可能进行优化编译。
• 如果函数被调用多次，则它有可能会被识别为热点函数，且ignition收集的类型信息证明可以进行优化编译的话，这时turbofan则会将bytecode编译为optimized machine code，以提高代码的执行性能。

图片中的红线是逆向的，这的确有点奇怪，optimized machine code会被还原为bytecode，这个过程叫做deoptimization。这是因为ignition收集的信息可能是错误的，比如add函数的参数之前是整数，后来又变成了字符串。生成的optimized machine code已经假定add函数的参数是整数，那当然是错误的，于是需要进行deoptimization。

function add(x, y) {
    return x + y;
}

add(1, 2);
add("1", "2");

在运行c、c++以及java等程序之前，需要进行编译，不能直接执行源码；但对于javascript来说，我们可以直接执行源码(比如：node server.js)，它是在运行的时候先编译再执行，这种方式被称为即时编译(just-in-time compilation)，简称为jit。因此，v8也属于jit编译器。

ignition：解释器

node.js是基于v8引擎实现的，因此node命令提供了很多v8引擎的选项，使用node的--print-bytecode选项，可以打印出ignition生成的bytecode。

factorial.js如下，由于v8不会编译没有被调用的函数，因此需要在最后一行调用factorial函数。

function factorial(n) {
    if (n === 1) {
        return 1;
    } else {
        return n * factorial(n - 1);
    }
}

factorial(10); // v8不会编译没有被调用的函数，因此这一行不能省略

使用node命令(node版本为12.6.0)的--print-bytecode选项，打印出ignition生成的bytecode：

node --print-bytecode factorial.js

控制台输出的内容非常多，最后一部分是factorial函数的bytecode：

[generated bytecode for function: factorial]
parameter count 2
register count 3
frame size 24
   18 e> 0x3541c2da112e @    0 : a5                stackcheck
   28 s> 0x3541c2da112f @    1 : 0c 01             ldasmi [1]
   34 e> 0x3541c2da1131 @    3 : 68 02 00          testequalstrict a0, [0]
         0x3541c2da1134 @    6 : 99 05             jumpiffalse [5] (0x3541c2da1139 @ 11)
   51 s> 0x3541c2da1136 @    8 : 0c 01             ldasmi [1]
   60 s> 0x3541c2da1138 @   10 : a9                return
   82 s> 0x3541c2da1139 @   11 : 1b 04             ldaimmutablecurrentcontextslot [4]
         0x3541c2da113b @   13 : 26 fa             star r1
         0x3541c2da113d @   15 : 25 02             ldar a0
  105 e> 0x3541c2da113f @   17 : 41 01 02          subsmi [1], [2]
         0x3541c2da1142 @   20 : 26 f9             star r2
   93 e> 0x3541c2da1144 @   22 : 5d fa f9 03       callundefinedreceiver1 r1, r2, [3]
   91 e> 0x3541c2da1148 @   26 : 36 02 01          mul a0, [1]
  110 s> 0x3541c2da114b @   29 : a9                return
constant pool (size = 0)
handler table (size = 0)

生成的bytecode其实挺简单的：

• 使用ldasmi命令将整数1保存到寄存器；
• 使用testequalstrict命令比较参数a0与1的大小；
• 如果a0与1相等，则jumpiffalse命令不会跳转，继续执行下一行代码；
• 如果a0与1不相等，则jumpiffalse命令会跳转到内存地址0x3541c2da1139
• ...

不难发现，bytecode某种程度上就是汇编语言，只是它没有对应特定的cpu，或者说它对应的是虚拟的cpu。这样的话，生成bytecode时简单很多，无需为不同的cpu生产不同的代码。要知道，v8支持9种不同的cpu，引入一个中间层bytecode，可以简化v8的编译流程，提高可扩展性。

如果我们在不同硬件上去生成bytecode，会发现生成代码的指令是一样的：

turbofan：编译器

使用node命令的--print-code以及--print-opt-code选项，打印出turbofan生成的汇编代码：

node --print-code --print-opt-code factorial.js

我是在mac上运行的，结果如下图所示：

比起bytecode，正真的汇编代码可读性差很多。而且，机器的cpu类型不一样的话，生成的汇编代码也不一样。

这些汇编代码就不用去管它了，因为最重要的是理解turbofan是如何优化所生成的汇编代码的。我们可以通过add函数来梳理整个优化过程。

function add(x, y) {
    return x + y;
}

add(1, 2);
add(3, 4);
add(5, 6);
add("7", "8");

由于js的变量是没有类型的，所以add函数的参数可以是任意类型：number、string、boolean等，这就意味着add函数可能是数字相加(v8还会区分整数和浮点数)，可能是字符串拼接，也可能是其他更复杂的操作。如果直接编译的话，生成的代码比如会有很多if...else分支，伪代码如下：

if (isinteger(x) && isinteger(y)) {
    // 整数相加
} else if (isfloat(x) && isfloat(y)) {
    // 浮点数相加
} else if (isstring(x) && isstring(y)) {
    // 字符串拼接
} else {
    // 各种其他情况
}

我只写了4个分支，实际上的分支其实更多，比如当参数类型不一致时还得进行类型转换，大家不妨看看ecmascript对加法是如何定义的：12.8.3the addition operator ( + )。

如果直接按照伪代码去生成汇编代码，那生成的代码必然非常冗长，这样会占用很多内存空间。

ignition在执行add(1, 2)时，已经知道add函数的两个参数都是整数，那么turbofan在编译bytecode时，就可以假定add函数的参数是整数，这样可以极大地简化生成的汇编代码，伪代码如下：

if (isinteger(x) && isinteger(y)) {
    // 整数相加
} else {
    // deoptimization
}

当然这样做也是有风险的，因为如果add函数参数不是整数，那么生成的汇编代码也没法执行，只能deoptimize为bytecode来执行。

也就是说，如果turbofan对add函数进行编译优化的话，则add(3, 4)与add(3, 4)可以执行优化的汇编代码，但是add("7", "8")只能deoptimize为bytecode来执行。

当然，turbofan所做的也不只是根据类型信息来简化代码执行流程，它还会进行其他优化，比如减少冗余代码等更复杂的事情。

由这个简单的例子可知，如果我们的js代码中变量的类型变来变去，是会给v8引擎增加不少麻烦的，为了提高性能，我们可以尽量不要去改变变量的类型。

对于性能要求比较高的项目，使用typescript也是不错的选择，理论上，如果严格遵守类型化的编程方式，也是可以提高性能的，类型化的代码有利于v8引擎优化编译的汇编代码，当然这一点还需要测试数据来证明。

orinoco：垃圾回收

强大的垃圾回收功能是v8实现提高性能的关键之一，因为它可以在避免影响js代码执行的情况下，同时回收内存空间，提高内存利用效率。

关于垃圾回收，我在javascript深入浅出第3课：什么是垃圾回收算法？中有详细介绍，这里就不再赘述了。

js引擎的未来

v8引擎确实很强大，但是它也不是无所不能的，简单地分析都可以发现一些可以优化的点。

我有一个新的想法，还没想好名字，不妨称作optimized typescript engine：

• 使用typescript编程，遵循严格的类型化编程规则，不要写成anyscript了；
• 构建的时候将typescript直接编译为bytecode，而不是生成js文件，这样运行的时候就省去了parse以及生成bytecode的过程；
• 运行的时候，需要先将bytecode编译为对应cpu的汇编代码；
• 由于采用了类型化的编程方式，有利于编译器优化所生成的汇编代码，省去了很多额外的操作；

这个想法其实可以基于v8引擎来实现，技术上应该是可行的：

• 将parser以及ignition拆分出来，用于构建阶段；
• 删掉turbofan处理js动态特性的相关代码；

这样做，可以将js引擎简化很多，一方面不再需要parse以及生成bytecode，另一方面编译器不再需要因为javascript动态特性做很多额外的工作。因此可以减少cpu、内存以及电量的使用，优化性能，唯一的问题可能是必须使用严格的ts语法进行编程。

为啥要这样做呢？因为对于iot硬件来说，cpu、内存、电量都是需要省着点用的，不是每一个智能家电都需要装一个骁龙855，如果希望把js应用到iot领域，必然需要从js引擎角度去进行优化，只是去做上层的框架是没有用的。

其实，facebook的hermes差不多就是这么干的，只是它没有要求用ts编程。

这应该是js引擎的未来，大家会看到越来越多这样的趋势。

关于js，我打算花1年时间写一个系列的博客《javascript深入浅出》，大家还有啥不太清楚的地方？不妨留言一下，我可以研究一下，然后再与大家分享一下。欢迎添加我的个人微信(kiwenlau)，我是fundebug的技术负责人，一个对js又爱又恨的程序员。

参考

• celebrating 10 years of v8
• launching ignition and turbofan
• javascript engines - how do they even?
• an introduction to speculative optimization in v8
• 2018年，javascript都经历了什么？
• javascript深入浅出第3课：什么是垃圾回收算法？
• fabrice bellard 是个什么水平的程序员？
• 如何评价 fabrice bellard 发布 quickjs js 引擎?

关于fundebug

fundebug专注于javascript、微信小程序、微信小游戏、支付宝小程序、react native、node.js和java线上应用实时bug监控。 自从2016年双十一正式上线，fundebug累计处理了10亿+错误事件，付费客户有阳光保险、核桃编程、荔枝fm、掌门1对1、微脉、青团社等众多品牌企业。欢迎大家免费试用！

版权声明

转载时请注明作者 fundebug以及本文地址：