[WebKit] JavaScriptCore解析--基础篇 (一)JSC与WebCore

傷城~ 2022-02-22 18:38 202阅读 0赞

先看一下官方的[基本介绍][Link 1],短短几句就塞满了关键字。

*SquirrelFish,正式名称是JavaScriptCore,包括register-based(基于寄存器的虚拟机), direct-threaded, high-level bytecode engine(字节码引擎).它使用基于内置copy propagation(复制性传播算法)的一次性编译器(one-pass compiler),能够延迟从语法树(Syntax Tree)上生成字节码(Bytecodes)。*

由此可见JavaScriptCore实现的复杂度。做为一个正在努力学习的菜鸟，我愿意给自己这样一个挑战，通过记录和总结学习内容，分成两个大的段落从内部视角来解析JavaScriptCore。首先是基础篇，目的是了解JavaScriptCore是如何与WebKit一起工作的，会涉及一些JavaScript引擎的一些基本概念。然后是高级篇，尝试解释JavaScriptCore中的核心技术，如Byte Code Compiler, JIT, VM以及GC等。

内容或许会显得晦涩，如果只是想简单地了解浏览器JS引擎的一些基本内容，推荐读读下面的文章。它们对于理解后面的内容也会非常有帮助。相对于这些资料，这个系列则侧重于从基础及从实例来分析JSC的实现。没办法做到高层次，只能追求贴近实现。

[ JavaScriptCore, WebKit的JS实现(一)][JavaScriptCore_ WebKit_JS]

[JavaScriptCore, WebKit的JS实现(完)][JavaScriptCore_ WebKit_JS 1]

[为什么V8引擎这么快？][V8]

当然，JavaScript的知识是必不可少的，推荐阅读一篇([JavaScript核心指南][JavaScript])，如果有时间可以深入学习一下其中提到的链接。

## 一. JavaScriptCore与WebCore ##

两者的关系可以简单的用下图来表示:

![20130511235202659][]

JSC为WebCore提供两个重要功能:

1. JS脚本的解析执行 (ScriptController)

主要是通过调用JavaScriptCore提供的两个C接口来实现的, checkSyntax和evaluate.

2. DOM节点的JS Bindings

DOM节点所对应的JS Bindings都可以回溯到JSC::JSNonFinalObject，再到JSObject，以实现和JSC绑定在一起。

\*关于JS Binding，可以先看一下这篇文章: [ 为JavaScript Binding添加新DOM对象的三种方式及实作][_JavaScript Binding_DOM]。至于JSC实现的细节，以后再展开。

## 二. JavaScriptCore基本工作过程 ##

JSC最简单的执行过程如下，再如之后JIT等在这个基础上的优化。

![20130511235223608][]

## 三. JavaScript脚本的执行 ##

以下分层说明脚本执行的步骤。 对于涉及到编译及执行的细节，则在后续解释。

### 3.1 接口层的交互 ###

JSC和其它几个主要的JS Engine一样，都是一个库，通过提供简单的API来供调用者使用。

从JSC接口来看，一个完整的JavaScript脚本的解析执行过程，可以概述以下:

![20130511235252857][]

过程很简单，可是很明显有些关键词必须要理解一下，如VM, Global Object, ExecState. 它们的关系也可以通过一张图来解释:

![20130511235317934][]

VM -> Virtual Machine, JavaScript要借助于一个运行时(Runtime)环境来运行。 SpiderMonkey就称之为Runtime.

GlobalObject -> 脚本执行时的全局对象。一个全局负责组织管理执行环境以及各个子对象。

ExecState -> 用于记录脚本执行上下文或环境, 也由GlobalObject管理。SpiderMoney以及Apple封装后的JavaScriptCore.framework都称之为上下文(Context). 可以将其视为一个执行脚本的对象来理解，只是它所产生和使用的Objects是共享的，并可以由GlobalObject来访问。

JS解释器各自实现的方式略有不同，JSC是由一个全局变量(Global Object)来创建上下文环境(ExecState), 而SpiderMonkey则是由执行上下文来创建全局变量。但无论哪种实现，全局变量和上下文都一一对应的，虽然原则上是允许一对多的情况出现。

最后看下JSC执行JS脚本的接口定义, 就很好理解了：

***JSValue** evaluate(**ExecState**\* exec,const**SourceCode**& source,**JSValue** thisValue,**JSValue**\* returnedException);*

\*thisValue就是JavaScript的this, 代表的是执行者, 但不一定是创建者。

\*使用JSC的示例代码，可以看看WebKit里的jsc.cpp就可以了。

\*如果觉得没有讲清楚，建议读读这里([JavaScript核心指南][JavaScript])。

### 3.2 JSC API执行脚本的步骤 ###

下图是JSC API函数evaluate的活动图:

![20130511235411730][]

重点在于它会使用要执行的脚本内容建立一个ProgramExecutable对象，然后调用Interpreter执行这个代表脚本的ProgramExecutable对象。

ProgramExecutable和Interpreter都是JSC核心类，ProgramExecutable负责编译代码为ByteCode，属于**解释器功能组**, 而Interpreter则负责解析执行ByteCode，则属于**VM功能组**.

![20130511235544696][]

*\*Interpreter提供的两个dump函数对于分析代码也很有用,  **dumpCallFrame**和**dumpRegisters**。*

再往下的内容，就是一个编译和执行的过程，后续再深入。

## 四. DOM Bindings的响应 ##

实现上的解析在这里:

[WebKit的JS Binding解析][WebKit_JS Binding]

以及另一篇可以加深理解:

[为JavaScript Binding添加新DOM对象的三种方式及实作][_JavaScript Binding_DOM]

转载请注明出处: [http://blog.csdn.net/horkychen][http_blog.csdn.net_horkychen]

**系列索引:**

> [基础篇 (一)JSC与WebCore][http_blog.csdn.net_horkychen]
> 
> [基础篇(二)解释器基础与JSC核心组件][JSC]
> 
> [基础篇(三)从脚本代码到JIT编译的代码实现][JIT]
> 
> [基础篇(四) 页面解析与JavaScript元素的执行][_JavaScript]
> 
> [高级篇(一) SSA (static single assignment)][SSA _static single assignment]
> 
> [高级篇(二) 类型推导(Type Inference)][_Type Inference]
> 
> [高级篇(三) Register Allocation & Trampoline][Register Allocation _ Trampoline]
> 
>   
>

[Link 1]: https://www.webkit.org/blog/214/introducing-squirrelfish-extreme
[JavaScriptCore_ WebKit_JS]: http://blog.csdn.net/horkychen/article/details/7888647
[JavaScriptCore_ WebKit_JS 1]: http://blog.csdn.net/horkychen/article/details/7897880
[V8]: http://blog.csdn.net/horkychen/article/details/7761199
[JavaScript]: http://blog.csdn.net/horkychen/article/details/8913400
[20130511235202659]: /images/20220222/0013bf2c904e460585baebd45ec74388.png
[_JavaScript Binding_DOM]: http://blog.csdn.net/horkychen/article/details/7640052
[20130511235223608]: /images/20220222/fd9d87e9a7cd42a3857f4e0ed9a5a8a9.png
[20130511235252857]: /images/20220222/4bd1ff9507ae4bfc8c0d0b594664e368.png
[20130511235317934]: /images/20220222/257b43c95920475a8c3c8a1c7b980ac0.png
[20130511235411730]: /images/20220222/d7f99b49a327485898dc7f049bb57d58.png
[20130511235544696]: /images/20220222/05d99d5bf86d447691e3571b4d436365.png
[WebKit_JS Binding]: http://blog.csdn.net/horkychen/article/details/7621877
[http_blog.csdn.net_horkychen]: http://blog.csdn.net/horkychen/article/details/8915907
[JSC]: http://blog.csdn.net/horkychen/article/details/8928578
[JIT]: http://blog.csdn.net/horkychen/article/details/8963124
[_JavaScript]: http://blog.csdn.net/horkychen/article/details/9003351
[SSA _static single assignment]: http://blog.csdn.net/horkychen/article/details/9075827
[_Type Inference]: http://blog.csdn.net/horkychen/article/details/9076425
[Register Allocation _ Trampoline]: http://blog.csdn.net/horkychen/article/details/9078111