简单三步,搞掂内存泄漏


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 相关文章推荐
javascript判断用户浏览器插件安装情况的代码
Jan 01 Javascript
JavaScript中Number.MIN_VALUE属性的使用示例
Jun 04 Javascript
Javascript中的方法和匿名方法实例详解
Jun 13 Javascript
jquery实现全选和全不选功能效果的实现代码【推荐】
May 05 Javascript
JQueryEasyUI之DataGrid数据显示
Nov 23 Javascript
VUE中使用Vue-resource完成交互
Jul 21 Javascript
Node.js上传文件功能之服务端如何获取文件上传进度
Feb 05 Javascript
vue读取本地的excel文件并显示在网页上方法示例
May 29 Javascript
微信小程序模板消息推送的两种实现方式
Aug 27 Javascript
浅谈layui里的上传控件问题
Sep 26 Javascript
微信小程序聊天功能的示例代码
Jan 13 Javascript
JavaScript实现横版菜单栏
Mar 17 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进程同步代码实例
2015/02/12 PHP
thinkphp5 migrate数据库迁移工具
2018/02/20 PHP
JS小功能(列表页面隔行变色)简单实现
2013/11/28 Javascript
javascript中定义类的方法详解
2015/02/10 Javascript
jquery插件splitScren实现页面分屏切换模板特效
2015/06/16 Javascript
浅谈node.js中async异步编程
2015/10/22 Javascript
javascript闭包(Closure)用法实例简析
2015/11/30 Javascript
jQuery ajax全局函数处理session过期后的ajax跳转问题
2016/06/03 Javascript
html+js实现简单的计算器代码(加减乘除)
2016/07/12 Javascript
理解AngularJs篇:30分钟快速掌握AngularJs
2016/12/23 Javascript
jQuery插件FusionCharts实现的3D柱状图效果实例【附demo源码下载】
2017/03/03 Javascript
Angularjs 实现移动端在线测评效果(推荐)
2017/04/05 Javascript
web.js.字符串与正则表达式操作
2017/05/13 Javascript
浅谈Node.js之异步流控制
2017/10/25 Javascript
Angular利用内容投射向组件输入ngForOf模板的方法
2018/03/05 Javascript
AngularJS中ng-options实现下拉列表的数据绑定方法
2018/08/13 Javascript
详解JavaScript事件循环机制
2018/09/07 Javascript
微信小程序实现文字跑马灯
2020/05/26 Javascript
Vue(定时器)解决mounted不能获取到data中的数据问题
2020/07/30 Javascript
使用python获取CPU和内存信息的思路与实现(linux系统)
2014/01/03 Python
python django 访问静态文件出现404或500错误
2017/01/20 Python
shell命令行,一键创建 python 模板文件脚本方法
2018/03/20 Python
利用Python如何将数据写到CSV文件中
2018/06/05 Python
python flask实现分页的示例代码
2018/08/02 Python
python实现合并多个list及合并多个django QuerySet的方法示例
2019/06/11 Python
利用python list完成最简单的DB连接池方法
2019/08/09 Python
使用opencv将视频帧转成图片输出
2019/12/10 Python
Python使用eval函数执行动态标表达式过程详解
2020/10/17 Python
使用HTML5和CSS3制作一个模态框的示例
2018/03/07 HTML / CSS
酒店拾金不昧表扬信
2014/01/18 职场文书
竞选部门副经理的自荐书范文
2014/02/11 职场文书
高考升学宴答谢词
2015/01/20 职场文书
匿名信格式范文
2015/05/27 职场文书
Python排序算法之插入排序及其优化方案详解
2021/06/11 Python
Redis中缓存穿透/击穿/雪崩问题和解决方法
2021/12/04 Redis
关于python3 opencv 图像二值化的问题(cv2.adaptiveThreshold函数)
2022/04/04 Python