如何查看网页端所占的内存大小

在做测试的过程中，有时需要查看某个网页的内存占用情况，有以下两个方式可以查看内存大小：

1、查看js代码运行时所产生的内存

直接在谷歌浏览器中打开F12调试模式，在Memory页签下点击“Take heap snapshot”来查看当前网页的js代码所占内存

其中， Shallow Size是对象本身占据的内存的大小，不包含其引用的对象。对于常规对象（非数组）的Shallow Size由其成员变量的数量和类型来定，而数组的ShallowSize由数组类型和数组长度来决定，它为数组元素大小的总和；
Retained Size为当前对象大小 和 当前对象可直接或间接引用到的对象的大小总和。(间接引用的含义：A->B->C,C就是间接引用) ，并且排除被GC Roots直接或者间接引用的对象

2、查看网页所产生的所有内存

在谷歌浏览器中点击“shift+esc“快捷键，进入浏览器的任务管理器

需要将需要的内存显示列添加进来：

网页的内存大小则为：GPU内存+图片缓存+脚本缓存+CSS缓存+Javascript使用的内存
注：“内存占用空间”是整个网页占用的空间，并不能代表实际的内存大小