chrome浏览器js内存溢出
Google Chrome 浏览器 提供了非常强大的JS调试工具,Heap Profiling便是其中一个。Heap Profiling可以记录当前的堆内存(heap)快照,并生成对象的描述文件,该描述文件给出了当时JS运行所用到的所有对象,以及这些对 ...
一、概述 Google Chrome浏览器提供了非常强大的JS调试工具,Heap Profiling便是其中一个。Heap Profiling可以记录当前的堆内存(heap)快照,并生成对象的描述文件,该描述文件给出了当时JS运行所用到的所有对象,以及这些对象所占用的内存大小、引用的层级关系等等。这些描述文件为内存泄漏的排查提供了非常有用的信息。 注意:本文里的所有例子均基于Google Chrome浏览器。 什么是heap JS运行的时候,会有栈内存(stack)和堆内存(heap),当我们用new实例化一个类的时候,这个new出来的对象就保存在heap里面,而这个对象的引用则存储在stack里。程序通过stack里的引用找到这个对象。例如var a = [1,2,3];,a是存储在stack里的引用,heap里存储着内容为[1,2,3]的Array对象。 二、Heap Profiling 打开工具 打开Chrome浏览器(版本25.0.1364.152 m),打开要监视的网站(这里以游戏大厅为例),按下F12调出调试工具,点击“Profiles”标签。可以看到下图: 可以看到,该面板可以监控CPU、CSS和内存,选中“Take Heap Snapshot”,点击“Start”按钮,就可以拍下当前JS的heap快照,如下图所示: 右边视图列出了heap里的对象列表。由于游戏大厅使用了Quark游戏库,所以这里可以清楚地看到Quark.XXX之类的类名称(即Function对象的引用名称)。 注意:每次拍快照前,都会先自动执行一次GC,所以在视图里的对象都是可及的。 视图解释 列字段解释: Constructor -- 类名Distance -- 估计是对象到根的引用层级距离 Objects Count -- 给出了当前有多少个该类的对象 Shallow Size -- 对象所占内存(不包含内部引用的其它对象所占的内存)(单位:字节) Retained Size -- 对象所占总内存(包含内部引用的其它对象所占的内存)(单位:字节) 下面解释一下部分类名称所代表的意思: 对于cls这个类名,是由于游戏大厅的继承机制里会使用“cls”这个引用名称,指向新建的继承类,所以凡是使用了该继承机制的类实例化出来的对象,都放在这里。例如程序中有一个类ClassA,继承了Quark.Text,则new出来的对象是放在cls里,不是放在Quark.Text里。 查看对象内容 查看对象的引用关系 看到context和self这两个引用,可以知道这个Quark.Text对象使用了JS常用的上下文绑定机制,被一个闭包里的变量引用着,相当于该Quark.Text对象多了两个引用,这种情况比较容易出现内存泄漏,如果闭包函数不释放,这个Quark.Text对象也释放不了。 三、内存泄漏的排查 观察者模式引起的内存泄漏 上下文绑定引起的内存泄漏 var a = new ClassA("a"); b.func = bind(function(){ b.func(); //输出 I am a a = null; //释放a //模拟上下文绑定 四、结语 |
chrome浏览器js内存溢出相关推荐
- Chrome浏览器 js 关闭窗口失效解决方法
Chrome浏览器 js 关闭窗口失效解决方法 参考文章: (1)Chrome浏览器 js 关闭窗口失效解决方法 (2)https://www.cnblogs.com/WhiteM/p/7098787 ...
- vue 项目下JS内存溢出
发生场景: vue下JS内存溢出 young object promotion failed Allocation failed - JavaScript heap out of memory 我当时 ...
- 解决Vue运行报js内存溢出问题
解决Vue运行报js内存溢出问题 下载内存控制插件 npm install increase-memory-limit 在package.json中添加脚本 "fix-memory-limi ...
- Google Chrome浏览器JS调试工具
作为Web开发人员,我为什么喜欢Google Chrome浏览器 [原文地址:http://www.cnblogs.com/QLeelulu/archive/2011/08/28/2156402.ht ...
- Chrome浏览器占用内存过高解决办法
最近一直使用chrome 浏览器进行页面测试,动不动就占用很大的内存,一开始以为是自己的网页加载图片过多导致的,但是后面发现还是太傻太天真,清缓存关网页,还是赶不上直接内存过高直接卡死状态,所以现在就 ...
- webpack打包js内存溢出:CALL_AND_RETRY_LAST Allocation failed - JavaScript heap out of memory
使用webpack打包react项目,内存溢出: <--- JS stacktrace --->==== JS stack trace ========================== ...
- js - 内存溢出与内存泄漏
<script>/*1.内存溢出一种程序运行出现的错误当程序运行需要的内存超过了剩余的内存时,就会抛出内存溢出的错误2.内存泄漏*占用的内存没有及时释放*内存泄漏积累多了就容易导致内存溢出 ...
- js内存溢出和内存泄漏
内存溢出和内存泄漏 内存溢出 内存溢出一般是指执行内存少于实际需要的内存,就会造成内存溢出 内存溢出造成的结果是先前保存的数据会被覆盖或者后来的数据会没地方存 内存溢出一般发生在后台 内存泄漏 内存泄 ...
- Google Chrome 浏览器JS无法更新解决办法
JS无法更新原因: 浏览器为了加载快,默认是按照自定规则更新缓存,非实时更新. 我们在开发的时候,JS变动很快,需要即时让浏览器加载最新文件,也就是禁用浏览器缓存 (1)使用F12进入开发者模式,找到 ...
最新文章
- Unity基础-Input接口
- MySQL——外部数据的批量导入
- Appium查找元素
- javascript --- 在linux上部署项目
- 各种有用的东西留言板
- 华为照片在哪个文件夹_原来华为手机还能这样清理垃圾,怪不得你的手机可以多用5年...
- 编写了一个文件编码转换器。
- 我在CodePlex上建的开源项目:JavaScript Lexer and Parser(欢迎加入)
- linux中关闭归档备份,RMAN在归档/非归档,库关闭/mounted/开启状态下的备份
- python类似turtle的库_Python库——turtle
- win7下如何删除不需要的windows服务
- java futuretask 状态_6.3 FutureTask基本操作总结 - JAVA 并发知识点总结
- Centos7 完全卸载MySQL8.0
- 多文件云传输系统框架
- 怎样做小游戏挖金子(VC,源码4)
- vue省市区三级地址文档
- vue3如何去掉控制台的warn信息
- mysql表达式转字符串_[转载]MYSQL 字符串操作[]
- 2019HPU-ICPC-Training-1
- 创意CSS写字本选择器