v8引擎 - 内存

1. 在node中查看内存

proces.memoryUsage()

rss -> 分配堆内存大小
heapTotal -> 堆内存占用大小
heapUsed -> 堆内存中所有变量内存占用大小（heapTotal的子集）
external -> 进程使用到的系统链接库所占用的内存
arrayBuffers -> 内存之中的一段二进制数据

image.png

2. 通过浏览器查看内存

window.performance

jsHeapSizeLimit -> js堆内存限制为多大
totalJSHeapSize -> js变量用了多少内存
usedJSHeapSize -> js堆内存已经用了多少

image.png

3. 让内存溢出

---

// 查看内存占用情况
getMemory = () => {
let memory = process.memoryUsage()
let format = (bytes) => ${(bytes / 1024 / 1024).toFixed(2)}MB;
console.log(heapTotal:${format(memory.heapTotal)}\theadUsed:${format(memory.heapUsed)});
}
let count = 0
let useMem = () => {
// 初始化一个超大的数
let size = 20 * 1024 * 1024
let arr = new Array(size)
console.log(count ++ );
return arr
}
// 定义一个全局的变量来接收超大的数组
let total = []
for (let i = 0; i < 30; i++) {
getMemory()
total.push(useMem())
}
console.log('success');

---

循环25次后，内存在4195.36MB爆掉。

image.png

4. 解除内存限制（一般用于已知的需要大文件上传或者占用大内存node服务的情况）

新生代内存拓展：max-new-space-size=1024；// 单位KB
老生代内存拓展：max-old-space-size=4096；// 单位MB
让内存溢出的任务继续执行：

node --max-old-space-size=6096 test.js  

解除限制到6096MB后代码成功执行。

image.png

5.变量处理

• 内存主要就是存储变量等数据的
• 局部变量当程序执行结束，且没有引用的时候就会随着消失。
• 全局对象会始终活到程序运行结束
• 内存优化体现：
  1. 减少全局变量，用局部变量或者模块化的思想
  2. 模块优化，例如vue2.0（new Vue()）到 vue3.0(createApp()) (摇树tree shaking优化)
  3. vite打包用rollup，因为rollup tree shaking优化更优秀。
• 内存优化技巧
  尽量不要定义全局变量
  全局变量记得销毁掉
  有匿名自执行函数变全局为局部
  闭包引用不需要使用时要销毁