JavaScript怎样查看变量所占内存的大小

[广告:最高 ¥2000 红包]阿里云服务器、主机等产品通用,可叠加官网常规优惠使用 | 限时领取

在python中,可以使用 sys.getsizeof 方法可以查看 python 对象的内存占用(单位:字节 byte)。

而JavaScript 不提供  C 系列语言中的sizeof方法,程序员不需要关心内存分配/释放。所以,该操作在js中相对比较麻烦。

本文总结了三个行之有效的方法,虽不精准,但也能粗略的估算对象在内存中的大小。

01 chrome 开发者工具法

chrome 开发者工具 -> memory -> Take snapshot -> 点击快照,在列表中寻找你的变量。

如下代码:在window对象下,生成对象、字符串、数组三个变量。

变量名以A_开头,如果是按名字排序,方便查找。

变量也可以适当弄大一点,按大小排序,方便查看。

在生成的快照中找到对应的网页的Window对象。

解释一下字段含义:

  • 浅层大小 : 对象本身占用的内存
  • 保留的大小: 对象本身及其引用总共占用的内存
  • 距离:当前对象到根的引用层级距离

简单直接,一目了然。

02 object-sizeof

object-sizeof – npm

根据 ECMAScript 语言规范,每个 String 值由 16 位无符号整数表示,Number 使用双精度 64 位格式 IEEE 754 值,包括特殊的“非数字”(NaN)值、正无穷大, 和负无穷大。

在此基础上,就可以计算一个js对象将分配多少内存。

object-sizeof,就是一个这样的类库。

注意,该类库不适用于 V8 引擎,因为V8对编译后的代码还进行了大量优化,所以理论上object-sizeof得到的变量大小,应大于chrome开发工具的大小。

安装 object-sizeof

npm install object-sizeof

类似代码:

得到大小:

确实要大于chrome开发者工具。

object-sizeof内部代码实现(核心部分):

03 查看进程

这个方法相当硬核。

memory – JavaScript object size – Stack Overflow

首先,打开PC的内存管理器。

在需要测算的代码前alert中断进程,代码执行完之后,再alert。再查看浏览器所占内存的变化。

这个办法是不是有点生猛?

代码如下:

参考资料

calculate memory size of javascript object, it is not a accurate value!

码中人 微信公众号