重学前端-JavaScript性能优化

重学前端-JavaScript性能优化

更新日期：11-2

第一次更新：11-2

第二次更新：11-3

1、内存管理

1、内存管理

开发者主动申请空间、使用空间和释放空间

2、垃圾回收和常见GC算法

• JavaScript中的内存管理是自动的
• 对象不再被引用时是垃圾
• 对象不能从根上访问到是垃圾

1、JavaScript可达对象

• 可以访问到的对象（引用、作用域链）
• 从根出发
• JavaScript中的根理解为全局变量对象

2、GC算法

1、概念

• GC就是垃圾回收机制的简写
• GC可以找到内存中的垃圾、并释放和回收空间

2、常见GC算法

• 引用计数
• 标记清除
• 标记整理
• 分代回收（V8）

3、引用计数算法

核心思想：设置引用数，判断当前引用是否为0

通过引用计数器，关系改变时修改引用数字，引用数字为0时执行垃圾回收

引用计数算法优缺点：

• 发现垃圾时立即回收
• 最大限度较少程序暂停
• 无法回收循环引用的对象
• 时间开销大

循环引用问题场景
function fn() {
  const obj1 = {};
  const obj2 = {};
  obj1.name = obj2;
  obj2.name = obj1;
  return 'con';
}
fn();

4、标记清除算法

核心思想：分标记和清除两个阶段

• 这个算法是设置一个根对象（root object），垃圾回收器会定期从这个根开始，找所有从根开始有引用到的对象，对于哪些没有引用到的对象，就认为是不可用的对象；
• 这个算法可以很好的解决循环引用的问题；

JS引擎比较广泛的采用的就是标记清除算法

优缺点：

• 解决循环引用不能回收的问题
• 会产生空间碎片化问题，不能使空间得到最大化的使用
• 不会立即回收垃圾对象

5、标记整理

优缺点：

• 解决标记清除的碎片化问题
• 不会立即回收垃圾对象

标记整理可以看作标记清除的增强，在清除阶段会先执行整理操作。

3、V8引擎的垃圾回收

1、认识V8

• V8是一款主流的JavaScript执行引擎
• V8采用即时编译
• V8内存设限

2、回收策略

• 采用分代回收的思想
• 内存分为新生代和老生代
• 不同对象采用不同算法

3、V8常见GC算法

• 分代回收
• 空间复制
• 标记清除
• 标记整理
• 标记增量

4、Performance工具

• GC的目的就是为了实现内存空间的良性循环
• 良性循环的基石是合理使用
• 时刻关注才能确定是否合理
• Performance提供多种监控方式

1、使用步骤

开发者工具 ➡️开启录制➡️执行用户行为➡️分析界面记录的内存信息