简单三步,搞掂内存泄漏


Posted in Javascript onMarch 10, 2007
原文地址:http://www.jackslocum.com/blog/2006/10/02/3-easy-steps-to-avoid-javascript-memory-leaks/
你可能还未知道,你浏览的大多数的js网站,会引起 内存泄漏。听起来有点夸张,但这是事实,难道我会骗你吗?
泄漏监视器
Leak Monitor
 这是个方便的FireFox扩展,当你离开那页的时候它便会指向JavsScript对象,如果出现泄漏的话会弹出一个窗口显示细节内容,而且能够告诉你是那个对象或函数引起的泄漏。
离开http://script.aculo.us/的时候
这应该我是最常见的泄漏  prototype.js, line 74:3
 
简单三步,搞掂内存泄漏
The Dojo Mail 例子页面
严重的泄漏,一下子弹出两个窗口 (注意滚动条!)。
简单三步,搞掂内存泄漏
Word Press
这个更离谱。我每次写完Word press,就会出现!
简单三步,搞掂内存泄漏

访问一般的站点,你会发现大多数站点都会出现这类问题。的确,如果一些网站没有经过这样的测试,多少会让人感到震惊,--本来适当一下的修改就可以确保这种问题不会发生。
 虽然这网站(Jack'sBlog、范例)统统都是JavaScript的,但你不必担心任何泄漏的危险。


如下简单的三步:
       1. 当你完成后,设置你的 XMLHttpRequest onreadystatechange handlers 为null,
我使用 YAHOO.util.Connect 来进行XHR链接 ,因为它使用了 polling mechanism来代替readstate, 这样我不用手工set null了。我推荐你,在允许的情况下,使用YAHOO.util.Connect (或建于其之上的 YAHOO.ext.UpdateManager)。
      2. 在unload事件中清除所有 DOM event handlers object ,如果它们有引用 (Refence)的机会的话。
能够让Library做的,就不要用自己的方法做! 对于事件event的机制,我均使用了YAHOO.util.Event来处理. 其它的library (prototype, dojo, etc) 亦有自己的相应的机制来处理。 --尽管我不清楚它们的执行效率去到那里。 如果你再仔细看看上面的截图,你会发现上面的泄漏代码都会关联到这些library里面去(用事实证明事故的源头,Frank注)
      3.除了一些基本类型的数据primitive value (String 、Number),切勿放其它任何东西在 DOM expando 或 property 。当然,你能保证及时清除它的话,便是一个例外。
       这就是最重要的金科玉律了。在DOM expando放东西,你会觉得很方便, 然后用 $()获取它, 但千万不要这样做。 真的,我知道你在想什么,现在的我已经有线想妄想症的认了.没错,很多场合都会把JS对象放到 DOM expando,也没啥状况发生,但也会有很多。。。。这种情况不容易检查出来啊!(例如:闭包closures). 所以要避免任何可能的发生,我只会按照这样的规律做.
摘要

解决这个问题并不是太难。它不需要任何技巧或经验之谈。只要注意好以上几点,一个新手novice也知道如何避免泄漏。
请拜托一些大网站(包括新的 Yahoo Mail!?!?),花点时间,做足功夫,让我(或其他人)浏览你的网页而不遭受内存泄漏。

Javascript 相关文章推荐
js限制文本框只能输入数字(正则表达式)
Jul 15 Javascript
基于jQuery.Validate验证库知识点的详解
Apr 26 Javascript
png在IE6 下无法透明的解决方法汇总
May 21 Javascript
微信小程序(应用号)开发新闻客户端实例
Oct 24 Javascript
JavaScrip数组删除特定元素的几种方法总结
Sep 06 Javascript
AngularJS集合数据遍历显示的实例
Dec 27 Javascript
jquery.onoff实现简单的开关按钮功能(推荐)
May 24 jQuery
解决百度Echarts图表坐标轴越界的方法
Oct 17 Javascript
vue刷新页面时去闪烁提升用户体验效果的实现方法
Dec 10 Javascript
vue安装遇到的5个报错及解决方法
Jun 12 Javascript
浅谈Vue为什么不能检测数组变动
Oct 14 Javascript
vue使用require.context实现动态注册路由
Dec 25 Vue.js
如何简单地用YUI做JavaScript动画
Mar 10 #Javascript
可缩放Reloaded-一个针对可缩放元素的复用组件
Mar 10 #Javascript
为Yahoo! UI Extensions Grid增加内置的可编辑器
Mar 10 #Javascript
Gird事件机制初级读本
Mar 10 #Javascript
Gird组件 Part-3:范例RSSFeed Viewer
Mar 10 #Javascript
对YUI扩展的Gird组件 Part-2
Mar 10 #Javascript
对YUI扩展的Gird组件 Part-1
Mar 10 #Javascript
You might like
php中使用base HTTP验证的方法
2015/04/20 PHP
[原创]解决wincache不支持64位PHP5.5/5.6的问题(提供64位wincache下载)
2016/06/22 PHP
Laravel 5使用Laravel Excel实现Excel/CSV文件导入导出的功能详解
2017/10/11 PHP
PHP使用两个栈实现队列功能的方法
2018/01/15 PHP
获取元素距离浏览器周边的位置的方法getBoundingClientRect
2013/04/17 Javascript
JavaScript中的运算符种类及其规则介绍
2013/09/26 Javascript
JQuery.get提交页面不跳转的解决方法
2015/01/13 Javascript
Jquery简单分页实现方法
2015/07/24 Javascript
探究Vue.js 2.0新增的虚拟DOM
2016/10/20 Javascript
基于Vue过渡状态实例讲解
2017/09/14 Javascript
动态加载JavaScript文件的3种方式
2018/05/05 Javascript
微信小程序自定义组件封装及父子间组件传值的方法
2018/08/28 Javascript
基于vue v-for 多层循环嵌套获取行数的方法
2018/09/26 Javascript
vue-cli 脚手架基于Nightwatch的端到端测试环境的过程
2018/09/30 Javascript
js实现内置计时器
2019/12/16 Javascript
vue elementui tree 任意级别拖拽功能代码
2020/08/31 Javascript
JavaScript构造函数原理及实现流程解析
2020/11/19 Javascript
[02:39]DOTA2国际邀请赛助威团西雅图第一天
2013/08/08 DOTA
Python3中的真除和Floor除法用法分析
2016/03/16 Python
使用pandas中的DataFrame数据绘制柱状图的方法
2018/04/10 Python
Tensorflow使用tfrecord输入数据格式
2018/06/19 Python
python pandas时序处理相关功能详解
2019/07/03 Python
Python使用get_text()方法从大段html中提取文本的实例
2019/08/27 Python
解决Pytorch 加载训练好的模型 遇到的error问题
2020/01/10 Python
python 如何对logging日志封装
2020/12/02 Python
PyCharm Ctrl+Shift+F 失灵的简单有效解决操作
2021/01/15 Python
程序集与命名空间有什么不同
2014/07/25 面试题
会展中心部门工作职责
2013/11/27 职场文书
课程设计心得体会
2013/12/28 职场文书
致跳远、跳高运动员广播稿
2014/01/09 职场文书
理工学院学生自我鉴定
2014/02/23 职场文书
《认识年月日》教学反思
2016/02/19 职场文书
几款流行的HTML5 UI框架比较(小结)
2021/04/08 HTML / CSS
教你怎么用python实现字符串转日期
2021/05/24 Python
Python 正则模块详情
2021/11/02 Python
阿里云 Windows server 2019 配置FTP
2022/04/28 Servers