window 系统里怎么使用 jsvu 工具快速调试 v8?

梦为马

关注

阅读 118

2022-08-18


jsvu 是什么?

jsvu is the JavaScript (engine) Version Updater. jsvu makes it easy to install recent versions of various JavaScript engines without having to compile them from source.

jsvu 是 JavaScript(引擎)版本更新器。 jsvu 可以轻松安装各种 JavaScript 引擎的最新版本,而无需从源代码编译它们。

支持多种操作系统和多种 JavaScript 引擎,目前为止支持的操作系统和引擎如下:

JavaScript engine

Binary name

​mac64​

​mac64arm​

​win32​

​win64​

​linux32​

​linux64​

​​Chakra​​

​chakra​​​ or ​​ch​







​​GraalJS​​

​graaljs​







​​Hermes​​

​hermes​​​ & ​​hermes-repl​







​​JavaScriptCore​​

​javascriptcore​​​ or ​​jsc​




*



​​QuickJS​​

​quickjs​







​​SpiderMonkey​​

​spidermonkey​​​ or ​​sm​







​​V8​​

​v8​







​​V8 debug​​

​v8-debug​







​​XS​​

​xs​

(32)



(32)



安装 jsvu

我们全局安装 jsvu

npm

window 系统里怎么使用 jsvu 工具快速调试 v8?_javascript

执行 jsvu

首次运行时,jsvu 会提示输入操作系统和架构,以及希望通过 jsvu 管理的 JavaScript 引擎列表。 然后它会下载并安装选择的每个引擎的最新版本。选择完之后,jsvu 会记住这次选择,下次再执行时还是会引用上一次的配置,我这里根据我的需求用了下面的配置。

jsvu --os=win64 --engines=v8,v8-debug

window 系统里怎么使用 jsvu 工具快速调试 v8?_字节码_02

window 系统里怎么使用 jsvu 工具快速调试 v8?_字节码_03

查看 jsvu 帮助信息

我们可以通过下面命令去查看帮助信息,​​ --os,以及--engines​​。

jsvu -h

window 系统里怎么使用 jsvu 工具快速调试 v8?_字节码_04

生成 v8,v8-debug 帮助信息

安装好 v8,v8-debug 之后,我们进入到 ​​C:\Users\guok\.jsvu​​ 目录下,能看到安装好的 cmd 文件。

window 系统里怎么使用 jsvu 工具快速调试 v8?_javascript_05

我们 shift + 右击 打开 powershell,输入下面命令,就会生成一个 ​​v8-help.txt​​ 的文本空文件。

# Linux 里面就是 touch v8-help.txt

window 系统里怎么使用 jsvu 工具快速调试 v8?_字节码_06

我们接下来把 v8 帮助信息放进去,我们打开 cmd,执行下面命令:

v8 --help >>

window 系统里怎么使用 jsvu 工具快速调试 v8?_javascript_07

执行完之后,我们发现 v8 的帮助信息存到了 ​​v8-help.txt​​ 记事本里

window 系统里怎么使用 jsvu 工具快速调试 v8?_v8_08

同样的道理:我们将 v8-debug 的帮助信息也弄成一个 txt 文本

ni v8-debug-help.txt

window 系统里怎么使用 jsvu 工具快速调试 v8?_字节码_09

v8-debug --help >>

window 系统里怎么使用 jsvu 工具快速调试 v8?_javascript_10


执行完之后,就会生成帮助信息的 ​​v8-debug-help.txt​​ 文本文件

window 系统里怎么使用 jsvu 工具快速调试 v8?_字节码_11

执行 v8,v8-debug

1、直接执行代码

# 可去帮助信息文件里查看命令的作用
-e execute a string in

我们打开 cmd,然后输入下面代码,发现可以执行出结果

v8 -e "console.log('kaimo666' + Date.now())"

window 系统里怎么使用 jsvu 工具快速调试 v8?_jsvu_12

2、直接执行 JavaScript 文件

我们在里面新建一个 ​​kaimo.js​​ 的文件,里面输入代码

console.log('kaimo666' + Date.now())

window 系统里怎么使用 jsvu 工具快速调试 v8?_v8_13

下面我们执行之这个文件

window 系统里怎么使用 jsvu 工具快速调试 v8?_v8_14


输入命令,发现也可以执行出来

v8 kaimo.js

window 系统里怎么使用 jsvu 工具快速调试 v8?_v8_15


注意这里的后缀记得写,不然会读取错误。

window 系统里怎么使用 jsvu 工具快速调试 v8?_jsvu_16

跟踪代码执行

1、查看 AST

查看 ast 我们需要用到命令 ​​--print-ast​​。

window 系统里怎么使用 jsvu 工具快速调试 v8?_javascript_17

v8-debug -e --print-ast "var kaimo = 313"

我们执行完上面的命令就可以看到打印的 AST

window 系统里怎么使用 jsvu 工具快速调试 v8?_字节码_18

2、查看作用域

查看作用域需要用到 ​​--print-scopes​​ 这个命令

window 系统里怎么使用 jsvu 工具快速调试 v8?_字节码_19

我们在 ​​kaimo.js​​ 里使用新的代码

var k = 313
function kaimo(){
console.log('kaimo777')
}

然后执行下面的命令查看作用域

v8-debug --print-scopes kaimo.js

执行结果如下:可以看到变量在全局作用域里

window 系统里怎么使用 jsvu 工具快速调试 v8?_javascript_20

Inner function scope:
function kaimo () { // (000001F4CAE9B970) (30, 66)
// NormalFunction
// 2 heap slots
}
Global scope:
global { // (000001F4CAE9B6C0) (0, 66)
// will be compiled
// NormalFunction
// 1 stack slots
// temporary vars:
TEMPORARY .result; // (000001F4CAE9BBD0) local[0]
// local vars:
VAR kaimo; // (000001F4CAE9BB40)
VAR k; // (000001F4CAE9B8E0)

function kaimo () { // (000001F4CAE9B970) (30, 66)
// lazily parsed
// NormalFunction
// 2 heap slots
}
}

3、查看生成的字节码

查看生成的字节码需要用到 ​​--print-bytecode​​(打印解释器生成的字节码)

window 系统里怎么使用 jsvu 工具快速调试 v8?_jsvu_21

v8-debug -e --print-bytecode "var kaimo = 666"

执行结果如下:

window 系统里怎么使用 jsvu 工具快速调试 v8?_jsvu_22

[generated bytecode for function:  (0x00c700253595 <SharedFunctionInfo>)]
Bytecode length: 20
Parameter count 1
Register count 3
Frame size 24
Bytecode age: 0
000000C70025361A @ 0 : 13 00 LdaConstant [0]
000000C70025361C @ 2 : c3 Star1
000000C70025361D @ 3 : 19 fe f8 Mov <closure>, r2
000000C700253620 @ 6 : 65 59 01 f9 02 CallRuntime [DeclareGlobals], r1-r2
000000C700253625 @ 11 : 00 0d 9a 02 LdaSmi.Wide [666]
000000C700253629 @ 15 : 23 01 00 StaGlobal [1], [0]
000000C70025362C @ 18 : 0e LdaUndefined
000000C70025362D @ 19 : a9 Return
Constant pool (size = 2)
000000C7002535E9: [FixedArray] in OldSpace
- map: 0x00c700002239 <Map(FIXED_ARRAY_TYPE)>
- length: 2
0: 0x00c7002535dd <FixedArray[1]>
1: 0x00c700253575 <String[5]: #kaimo>
Handler Table (size = 0)
Source Position Table (size = 0)

4、查看优化与反优化

生成字节码之后,解释器会解释执行这段字节码,如果重复执行了某段代码,监控器就会将其标记为热点代码,并提交给编译器优化执行。

window 系统里怎么使用 jsvu 工具快速调试 v8?_jsvu_23

查看哪些代码被优化,使用命令:

# 跟踪优化编译
v8-debug -e --trace-opt "var kaimo = 666"

查看哪些代码被反优化,使用命令:

# 跟踪去优化
v8-debug -e --trace-deopt "var kaimo = 666"

其它命令可以自己去尝试。

参考资料

  • ​​github:jsvu​​
  • ​​npm:jsvu​​
  • ​​浅谈Google V8 引擎​​


精彩评论(0)

0 0 举报