《图解 Google V8》事件循环和垃圾回收——学习笔记(三)
这是《图解 Google V8》第三篇/共三篇:事件循环和垃圾回收
这里主要讲了 2 点:
- 事件循环:宏任务和微任务
- 什么是微任务
- 微任务的执行时机
- 垃圾回收
- 垃圾回收运行过程
- 垃圾回收算法
通过这个专栏的学习,V8
不在是个陌生的黑盒了,变成了一个熟悉的黑盒,因为这个专栏让你了解了 V8
的大致原理,面试时吹吹牛皮还是可以的,不过也就仅此而已,细节方面还需要自己去深入
17 | 消息队列:V8 是怎么实现回调函数的?
- 同步回调函数是在执行函数内部被执行的
- 异步回调函数是在执行函数外部被执行的
UI
线程是运行窗口的线程,也叫主线程
当鼠标点击了页面,系统会将该事件交给 UI
线程来处理,但是 UI
线程不能立即响应来处理
针对这种情况,浏览器为 UI
线程提供了消息队列,然后 UI
线程会不断的从消息队列中取出事件和执行事件,如果当前没有任何消息等待被处理,那么这个循环就会被挂起
setTimeout
在执行 setTimeout
,浏览器会将回调函数封装成一个事件,添加到消息队列中,然后 UI
线程会不间断的从消息队列中取出任务,执行任务,在合适的时机取出 setTimeout
的回调函数
XMLHttpRequest
在 UI
线程执行 XMLHttpRequest
,会阻塞 UI
线程,所以 UI
线程会将它分配给网络线程(是网络进程中的一个线程):
UI
线程从消息队列中取出任务,分析- 发现是一个下载任务,就会交给网络线程去执行
- 网络线程接到下载请求后,会和服务器建立联系,发出下载请求
- 网络线程不断从服务器接收数据
- 网络请求在收到数据后,会将返回的数据和回调函数封装成一个事件,放在消息队列中
UI
线程循环读取消息队列,如果是下载状态的事件,UI
线程就会执行回调函数- 直到下载事件结束,页面显示下载完成
18 | 异步编程(一):V8 是如何实现微任务的?
宏任务是消息队列中等待被主线程执行的事件,每个宏任务在执行的时候都会创建栈,宏任务结束,栈也会被清空
微任务是一个需要异步执行的函数,执行时机是在主函数执行结束之后,当前宏任务结束之前
微任务执行的时机:
- 如果当前任务中产生了一个微任务,不会再当前的函数中被执行,所以执行微任务时,不会导致栈的无限扩张
- 微任务会在当前任务执行结束之前被执行
- 微任务结束执行之前,不会执行其他的任务
参考资料
19 |异步编程(二):V8 是如何实现 async/await 的?
生成器 Generator
带星号的函数配合 yield
可以实现函数的暂停和恢复,这个叫生成器
```js function* getResult() { console.log("getUserID before"); yield "getUserID"; console.log("getUserName before"); yield "getUserName"; console.log("name before"); return "name"; }
let result = getResult();
console.log(result.next().value); console.log(result.next().value); console.log(result.next().value); ```
在生成器内部,如果遇到 yield
关键词,那么 V8
将 yield
后面的内容返回给外部,并暂停函数的执行
生成器暂停后,外面代码开始执行,如果想要继续恢复生成器的执行,就可以使用 result.next()
方法
在暂停和恢复之间切换,这背后的原理是协程,协程是比线程更加轻量级,它是跑在线程上的任务
一个线程有多个协程,但只能执行一个协程,如果 A
协程启动 B
协程,那 A
协程就是 B
协程的父协程
使用生成器编写同步代码
```js function* getResult() { let id_res = yield fetch(id_url); console.log(id_res); let id_text = yield id_res.text(); console.log(id_text);
let new_name_url = name_url + "?id=" + id_text; console.log(new_name_url);
let name_res = yield fetch(new_name_url); console.log(name_res); let name_text = yield name_res.text(); console.log(name_text); } let result = getResult(); result .next() .value.then((response) => { return result.next(response).value; }) .then((response) => { return result.next(response).value; }) .then((response) => { return result.next(response).value; }) .then((response) => { return result.next(response).value; }); ```
把执行生成器代码的函数称为执行器(可参考著名的 co
框架)
```js function* getResult() { let id_res = yield fetch(id_url); console.log(id_res); let id_text = yield id_res.text(); console.log(id_text);
let new_name_url = name_url + "?id=" + id_text; console.log(new_name_url);
let name_res = yield fetch(new_name_url); console.log(name_res); let name_text = yield name_res.text(); console.log(name_text); } co(getResult()); ```
async/await
async
是异步执行并隐式返回 Promise
作为结果的函数。
await
后面可以接两种类型的表达式:
- 任何普通表达式
Promise
对象的表达式
如果 await
等待的是一个 Promise
对象,它会暂停执行生成器函数,直到 Promise
对象变成 resolve
才会恢复执行,然后 resolve
的值作为 await
表达式的运算结果
js
function NeverResolvePromise() {
return new Promise((resolve, reject) => {});
}
function ResolvePromise() {
return new Promise((resolve, reject) => resolve("resolve"));
}
async function getResult() {
let a = await NeverResolvePromise();
console.log(a); // 不会输出
}
async function getResult2() {
let b = await ResolvePromise();
console.log(b); // "resolve"
}
getResult();
getResult2();
console.log(0);
async
是一个异步执行的函数,不会阻塞主线程的执行
async
函数在执行时,是一个单独的协程,可以用 await
来暂停,由于等待的是一个 Promise
对象,就可以用 resolve
来恢复该协程
参考资料
20 | 垃圾回收(一):V8 的两个垃圾回收器是如何工作的?
- 通过
GC Root
标记内存中活动对象和非活动对象。 V8
采用可访问性(reachability)算法判断堆中的对象是是否为活动对象GC Root
能够遍历到的对象,是可访问的(reachable),称为活动对象GC Root
不能遍历到的对象,认为是不可访问的(unreachable),称为非活动对象
- 浏览器环境中有很多
GC Root
window
对象(位于每个iframe
中)DOM
,由可以通过遍历文档到达的所有原生 DOM 节点组成- 存放栈上变量
- 回收非活动对象所占用的内存
- 回收后,做内存整理(可选,有些垃圾回收器不会产生内存碎片,比如副垃圾回收器)
- 回收结束后,内存中会出现大量不连续的空间,这空间被称为内存碎片
- 如果内存碎片太多的话,当需要较大连续的内存时,就会出现内存不足
V8
受代际假说影响,使用了两个垃圾回收器:主垃圾回收器(Major GC
),副垃圾回收器(Minor GC
)
代际假说:
- 大部分对象都是“朝生夕死”的,也就是说大部分对象在内存中存活的时间很短,比如函数内部声明的变量,或者块级作用域中的变量,当函数或者代码块执行结束时,作用域中定义的变量就会被销毁。因此这一类对象一经分配内存,很快就变得不可访问
- 不死的对象,会活得更久,比如:
window
、DOM
、Web API
等
V8
把堆分为两个区域:
- 新生代:存放生存时间短的对象
- 容量小,
1~8M
- 使用副垃圾回收器(
Minor GC
) - 使用
Scavenge
算法,将新生代区域分成两部分- 对象区域 (
from-space
) - 空闲区域 (
to-space
) - 对象区域放新加入的对象
- 对象区域快满的时候,执行垃圾清理(先标记,再清理)
- 清理的把活动对象复制到空闲区域,并且排序(空闲区域就没有内存碎片了)
- 复制完之后,把对象区域和空闲区域进行翻转
- 重复执行上面的步骤
- 经过两次垃圾回收后还存在的对象,移动到老生代中
- 对象区域 (
- 老生代:存放生存时间久的对象
- 容量大
- 对象占用空间大
- 对象存活时间长
- 使用主垃圾回收器(
Major GC
) - 使用标记 - 清除算法(
Mark-Sweep
)- 标记:从根元素开始,找到活动对象,找不到的就是垃圾
- 清理:直接清理垃圾(会产生垃圾碎片)
- 或者使用标记 - 整理算法(
Mark-Compact
)- 标记:从根元素开始,找到活动对象,找不到的就是垃圾
- 整理:把活动对象向同一端移动,另一端直接清理(不会产生垃圾碎片)
参考资料
- Understanding Garbage Collection and hunting Memory Leaks in Node.js
- 深入理解 Node.js:核心思想与源码分析
- When and How JavaScript garbage collector works
- V8 引擎的内存管理
- Trash talk: the Orinoco garbage collector
21 | 垃圾回收(二):V8 是如何优化垃圾回收器执行效率的?
JavaScript 是运行在主线程上的,一旦执行垃圾回收算法,JavaScript 会暂停执行,等垃圾回收完毕后再恢复执行,这种行为成为全停顿(Stop-The-World
)
V8 团队向现有的垃圾回收器添加并行、并发、增量等垃圾回收技术
这些技术主要从两方面解决垃圾回收效率的问题:
- 将一个完整的垃圾回收任务拆分成多个小的任务
- 将标记对象、移动对象等任务转移到后端线程进行
并行回收(在主线程执行,全停顿)
在主线程执行垃圾回收的任务时,开启多个协助线程,同时执行回收工作
采用并行回收,垃圾回收所消耗的时间 = 辅助线程数 * 单个线程所消耗的时间
在执行垃圾标记的过程中,主线程不会同时执行 JavaScript 代码,因此代码不会改变回收过程
假设内存状态是静态的,因此只要确保同时只有一个辅助线程在访问对象就好了
这是 V8 副垃圾回收器采用的策略
它在执行垃圾回收的过程中,启动多个线程来负责新生代中的垃圾清理,同时将对象空间中的数据移动到空闲区域,这操作会导致数据地址变了,所以还需要同步更新这些对象的指针
增量回收(在主线程执行,穿插在各个任务之间)
将标记工作分解为更小的块,穿插在主线程不同的任务之间执行
采用增量回收,垃圾回收器没必要一次执行完成的垃圾回收流程,每次执行的只是一小部分工作
增量回收是并发的,需要满足两点要求:
- 垃圾回收可以随时被暂停和重启,暂停的时候需要保留扫描结果,等待下一次回收
- 在暂停期间,被标记好的垃圾数据,如果被修改了,垃圾回收器需要正确的处理
在垃圾回收的时候,V8 使用三色标记法:
- 黑色:表示所有能访问到的数据(活动数据),且子节点已经都标记完成
- 白色:表示还没有被访问到,如果在一轮遍历结束还是白色,这个数据就会被回收
- 灰色:表示正在处理这个节点,且子节点还没被处理
垃圾回收器会根据有没有灰色的节点来判断这一轮遍历有没有结束
- 没有灰色:一轮遍历结束,可以清理垃圾
- 有灰色:一轮遍历还没结束,从灰色的节点继续执行
标记为黑色的数据被修改了,也就是说黑色的节点引用了一个白色的节点,但是黑色的节点是已经完成标记的,这是它后面还有一个白色的节点是不会被标记为黑色的
这就需要一个约束条件:不能让黑色节点指向白色节点
这个约束条件是:写屏障机制(Write-barrier):
- 当发生黑色节点引用白色节点,写屏障机制会强制将这个白色节点变为灰色的,从而保证黑色节点不能指向白色节点
这种方法被称为强三色不变性
并发回收(不在主线程执行)
在主线程执行 JavaScript 时,辅助线程在后台执行垃圾回收操作
优点:主线程不会被挂起(JavaScript 可以自由执行,同时辅助线程可以执行垃圾回收)
但有两点导致它很难实现:
- 主线程执行 JavaScript 时,堆中的内容随时会变化,就会使得辅助线程之前的工作白做
- 主线程和辅助线程可能会在同一时间去修改同一个对象,这就需要额外实现读写锁的功能
《图解 Google V8》学习笔记系列
- 《图解 Google V8》事件循环和垃圾回收——学习笔记(三)
- 迟迟没学会grid,是因为你没理解flex
- 为什么补码可以将减法变成加法运算
- 阿里云开源业内首个应用多活项目 AppActive,与社区共建云原生容灾标准
- 云原生下的指标与日志采集
- 开发者故事|朝九晚六大小周,我就是快乐的技术人
- 「Spark从精通到重新入门(二)」Spark中不可不知的动态资源分配
- 「Spark从精通到重新入门(一)」Spark 中不可不知的动态优化
- 阿里云上云第一课,助力 HTML入门
- 1分钟体验代码自动捉虫,Cherry键盘、积木星球抱回家
- 7-ELEVEn 便利店 EDI 概览
- mPaaS 月度小报|为采购而生,全新资源包上架;前端 2D 游戏化互动入门指南
- 生态和场景一站式集成?来看看小程序的“共享主义”
- 超视频化到来,你能看见什么?
- CodeDay 北京站报名倒计时
- CodeDay#7 启动 | 北京欢迎你
- 未来,让我们一起想象 — “Imagine” 阿里云视频云全景创新峰会
- 消息中间件:为什么我们选择 RocketMQ
- ucc编译器(优化)
- ucc编译器(汇编生成)