
微信公众号:爱写bugger的阿拉斯加
若有问题或建议,请后台留言,我会尽力解决你的问题。vue
前言
此文章是我最近在看的【WebKit 技术内幕】一书的一些理解和作的笔记。java
而【WebKit 技术内幕】是基于 WebKit 的 Chromium 项目的讲解。node
书接上文 浏览器之硬件加速机制react
本章主要讲解 WebKit 中普遍使用的 JavaScriptCore 引擎和 V8 引擎。程序员
1. javaScript
简介
JavaScript 是一种脚本语言,主要用在 Web 的客户端,是控制网页客户端的逻辑,例如同用户的交互,异步通讯等需求。web
本质上它是一种解释语言,函数是它的第一等公民,也就是函数也可以看成参数或者返回值来传递。浏览器
JavaScript 语言的一个重大特色就是,它是一种无类型语言,或者说是动态类型语言。微信
这一特性致使咱们没有办法有编译的时候知道变量的类型,因此只能在运行的时候才能肯定。架构
推进 JavaScript 运行速度提升的另外一大利器是 JIT(Just-In-Time)技术,它不是一项全新的技术,其做用是解决解释性语言的性能问题。app
主要思想是当解释器将代码解释成内部表示的时候,JavaScript 的执行环境不只是解释这些内部表示,并且将其中一些字节码(主要是使用率高的部分)转成本地代码(汇编代码),这样能够被 CPU 直接执行,而不是解释执行,从而极大提升性能。
1.2 JavaScript 引擎
JavaScript 引擎就是可以将 JavaScript 代码处理并执行的运行环境。

JavaScript 引擎包括如下部分:
编译器:将源代码编译成抽象语法树,在某些引擎中还包含将抽象语法树转换成字节码。
解释器:在某些引擎中,解释器主要是接收字节码,解释执行这个字节码,同时也依赖垃圾回收机制等。
JIT 工具:一个可以 JIT 的工具,将字节码或者抽象语法树转换在本地代码,固然它也须要依赖牢记。
垃圾回收器和分析工具(Profiler):负责垃圾回收和 收集引擎中的信息,帮助改善引擎的性能和功效。
1.3 JavaScript 引擎和渲染引擎
从模块上看,它们是两个独立的模块,分别负责不一样的事情:
JavaScript 引擎负责执行 JavaScript 代码,而渲染引擎负责渲染网页。
JavaScript 引擎提供调用接口给渲染引擎,以便让渲染引擎使用 JavaScript 引擎来处理JavaScript 代码并获取结果。
这并非所有,JavaScript 引擎须要可以访问渲染引擎构建的 DOM 树,因此 JavaScript 引擎一般须要提供桥接的接口,而渲染引擎则根据桥接接口来提供让 JavaScript 访问 DOM 的能力。
在如今众多的 HTML5 能力中,不少是经过 JavaScript 接口提供给开发者的,因此这部分一样须要根据桥接接口来实现具体类,以便让 JavaScript 引擎可以回调渲染引擎的具体实现。

在 WebKit 中,两种引擎经过桥接接口来访问 DOM 结构,这对性能来讲是一个重大的损失,由于每次 JavaScript 代码访问 DOM 都须要经过复杂和低效的桥接接口来完成。
1.2 V8 引擎
1.2.1 基础
V8 是一个开源项目,也是一个 JavaScript 引擎的实现。
V8 支持众多的操做系统。包括可是不限于 Windows、Liunx、Android、Mac OSX 等。同时它也可以支持众多的硬件架构,例如 IA3二、X6四、ARM 、MIPS 等。
1.2.1.1 代码结构

1.2.2 V8 工做过程
V8 工做过程有两个阶段,第一是编译,第二是运行。
鉴于 JavaScript 语言的工做方式,它们都是在用户使用它们的时候发生。
同时,V8 还有一个特色是 延迟(deferred)思想,这使得不少 JavaScript 代码的编译直到运行的时候被调用到才会发生,这样能够减小时间开销。
先看编译阶段:

从图中能够看出,首先它也是将源代码转变成抽象语法树,V8 引擎并不将抽象语法树转变成字节码或者其余中间表示,而是经过 JIT 编译器的全代码生成器(full code generator)从抽象语法树直接生成本地代码,这样子减小了转换时间。
再看运行阶段:
V8 支持 JavaScript 代码运行用到了一堆类。

V8 引擎是按照图 9-17 中描述的过程来执行的,实际过程更为复杂,并且还有垃圾回收等处理。
1.3 JavaScriptCore 引擎
JavaScriptCore 引擎是 WebKit 中默认的 JavaScript 引擎,也是苹果开源 WebKit 项目以后,开源的另一个重要的项目。
1.3.2 架构和模块
1.3.2.1 代码结构

演进过程:
首先是词法和语法分析,而后使用底层解释器来解释那些字节码。
以后,经过简单的 JIT 编译器将它们转化成本地代码,最后就是引入 DFG JIT 编译器。
最后
最后送上 编写高效JavaScript代码
但愿本文对你有点帮助。
对 全栈开发 有兴趣的朋友能够扫下方二维码关注个人公众号
微信公众号:爱写bugger的阿拉斯加
分享 web 开发相关的技术文章,热点资源,全栈程序员的成长之路,你们一块儿交流成长。
只要关注公众号并回复 福利 便免费送你六套视频资源,绝对干货。
福利详情请点击: 免费资源分享——Python、Java、Linux、Go、node、vue、react、javaScript

本文分享自微信公众号 - 全栈修炼(QuanZhanXiuLian)。
若有侵权,请联系 support@oschina.cn 删除。
本文参与“OSC源创计划”,欢迎正在阅读的你也加入,一块儿分享。