79 可读性
 将光标移到文章中的句子上,可以查看原文。 显示译文      显示原文      双语对照

分享 |
为什么jquery泄漏内存?
Why does jquery leak memory so badly?

60 0

这是我上周发布的一个问题 http://stackoverflow.com/questions/2429056/simple-jquery-ajax-call-leaks-memory-in-ie

我喜欢jquery语法和它的所有优秀特性,但是我有一个页面,它会自动更新通过ajax调用的表格单元,而这些。

所以我创建了两个简单的测试页面来进行实验。 每. 1 秒都有一个ajax调用。 在每次成功调用ajax之后,计数器递增,DOM更新。 脚本在 1000 个循环后停止。

一个使用jquery同时调用ajax调用和更新DOM 。 另一种使用Yahoo API为ajax,并执行一个 document.getElementById(...). innerHTML来更新DOM 。

jquery版本泄漏内存错误。 以滴水( 在XP Home运行,ie7 ),它开始在9MB,并完成在大约48mb,随着记忆一直都在呈线性增长。 如果我注释出更新DOM的行,它仍然会在32mb完成,这表明即使简单的DOM更新也会泄漏大量内存。 非jquery版本在大约个字节的时间开始并完成,不管它是否更新DOM 。

有人对jquery泄漏的原因有很好的解释? 我是不是漏掉了什么? 是否有循环引用我不清楚? 或者jquery只是有一些严重的内存问题?

这是一个泄漏( jquery ) 版本的源:


<html> <head> <script type="text/javascript" src="http://www.google.com/jsapi"></script> <script type="text/javascript"> google.load('jquery', '1.4.2'); </script> <script type="text/javascript"> var counter = 0; leakTest(); function leakTest() { $.ajax({ url: '/html/delme.x', type: 'GET', success: incrementCounter }); } function incrementCounter(data) { if (counter<1000) { counter++; $('#counter').text(counter); setTimeout(leakTest,100); } else $('#counter').text('finished.'); } </script> </head> <body> <div>Why is memory usage going up?</div> <div id="counter"></div> </body>
</html>


这里是:的版本:


<html> <head> <script type="text/javascript" src="http://yui.yahooapis.com/2.8.0r4/build/yahoo/yahoo-min.js"></script> <script type="text/javascript" src="http://yui.yahooapis.com/2.8.0r4/build/event/event-min.js"></script> <script type="text/javascript" src="http://yui.yahooapis.com/2.8.0r4/build/connection/connection_core-min.js"></script> <script type="text/javascript"> var counter = 0; leakTest(); function leakTest() { YAHOO.util. Connect.asyncRequest('GET', '/html/delme.x', {success:incrementCounter}); } function incrementCounter(o) { if (counter<1000) { counter++; document.getElementById('counter').innerHTML = counter; setTimeout(leakTest,100); } else document.getElementById('counter').innerHTML = 'finished.' } </script> </head> <body> <div>Memory usage is stable, right?</div> <div id="counter"></div> </body>
</html>


时间: 15年08月05日 原作者: Thomas Lane

7 0

我最初的想法是它与jquery ajax方法的方式有关:

a. 创建循环引用,尤其是对IE

b. 创建内部对象的属性,这些对象由于创建的方式和DontDelete属性的设置而无法删除。 有关更多信息,请参见此选项: http://perfectionkills.com/understanding-delete/

不管是哪种方式,垃圾收集器都会被阻止接收垃圾,这会导致内存泄漏失控,尤其是当可疑函数频繁执行时。

发布时间: 15年08月05日 原作者: Jessica Jacobs
...