简单三步,搞掂内存泄漏


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 相关文章推荐
用于自动添加Digg This!按钮的JavaScript
Dec 23 Javascript
基于jQuery的一个扩展form序列化到json对象
Dec 09 Javascript
EasyUI 中 MenuButton 的使用方法
Jul 14 Javascript
基于javascript实现判断移动终端浏览器版本信息
Dec 09 Javascript
Jquery 实现图片轮换
Jan 28 Javascript
使用 TypeScript 重新编写的 JavaScript 坦克大战游戏代码
Apr 07 Javascript
浅析javascript函数表达式
Feb 10 Javascript
webpack里使用jquery.mCustomScrollbar插件的方法
May 30 jQuery
JavaScript实现的简单加密解密操作示例
Jun 01 Javascript
一篇文章介绍redux、react-redux、redux-saga总结
May 23 Javascript
node.js如何根据URL返回指定的图片详解
Oct 21 Javascript
webpack介绍使用配置教程详解webpack介绍和使用
Jun 25 Javascript
如何简单地用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查询mysql大量数据造成内存不足的解决方法
2015/03/04 PHP
jquery 插件 人性化的消息显示
2008/01/21 Javascript
JS去除字符串的空格增强版(可以去除中间的空格)
2009/08/26 Javascript
JavaScript 组件之旅(三):用 Ant 构建组件
2009/10/28 Javascript
jQuery利用sort对DOM元素进行排序操作
2016/11/07 Javascript
通过扫描二维码打开app的实现代码
2016/11/10 Javascript
EditPlus 正则表达式 实战(3)
2016/12/15 Javascript
VuePress 中如何增加用户登录功能
2019/11/29 Javascript
python的类方法和静态方法
2014/12/13 Python
用Python编写一个简单的俄罗斯方块游戏的教程
2015/04/03 Python
Python使用functools模块中的partial函数生成偏函数
2016/07/02 Python
pandas or sql计算前后两行数据间的增值方法
2018/04/20 Python
Python进阶之自定义对象实现切片功能
2019/01/07 Python
python ipset管理 增删白名单的方法
2019/01/14 Python
Django框架设置cookies与获取cookies操作详解
2019/05/27 Python
python 计算数据偏差和峰度的方法
2019/06/29 Python
使用pytorch完成kaggle猫狗图像识别方式
2020/01/10 Python
详解django使用include无法跳转的解决方法
2020/03/19 Python
什么是Python变量作用域
2020/06/03 Python
详解CSS 3 中的 calc() 方法
2018/01/12 HTML / CSS
HTML5中判断用户是否正在浏览页面的方法
2014/05/03 HTML / CSS
Lyle & Scott苏格兰金鹰官网:英国皇室御用品牌
2018/05/09 全球购物
测控技术与仪器个人求职信范文
2013/12/30 职场文书
教育学习自我评价
2014/02/03 职场文书
岗位廉政承诺书
2014/03/27 职场文书
班级课外活动总结
2014/07/09 职场文书
学校个人对照检查材料
2014/08/26 职场文书
一份没有按时交货失信于客户的检讨书
2014/09/19 职场文书
横店影视城导游词
2015/02/06 职场文书
世界卫生日宣传活动总结
2015/02/09 职场文书
故意杀人罪辩护词
2015/05/21 职场文书
纪委立案决定书
2015/06/24 职场文书
2016习总书记系列重要讲话心得体会
2016/01/15 职场文书
vue实现列表垂直无缝滚动
2022/04/08 Vue.js
MySQL 数据表操作
2022/05/04 MySQL
Navicat Premium自定义 sql 标签的创建方式
2022/09/23 数据库