我讀了關於內存泄漏因爲我的網站的內存不斷堆積,當我遇到這篇文章來自IBM:jQuery的事件處理會導致內存泄漏嗎?
http://www.ibm.com/developerworks/web/library/wa-memleak/#N10116
閉包和循環引用
在清單5您會看到一個JavaScript對象(obj)包含對DOM對象的引用(由id「元素」引用)的閉包。 DOM元素反過來對JavaScript obj有一個引用。 JavaScript對象和DOM對象之間產生的循環引用導致內存泄漏。清單5.事件處理內存泄漏模式:
<html>
<body>
<script type="text/javascript">
document.write("Program to illustrate memory leak via closure");
window.onload=function outerFunction(){
var obj = document.getElementById("element");
obj.onclick=function innerFunction(){
alert("Hi! I will leak");
};
obj.bigString=new Array(1000).join(new Array(2000).join("XXXXX"));
// This is used to make the leak significant
};
</script>
<button id="element">Click Me</button>
</body>
</html>
的一個解決方案,他們給,在onload-function
的端部被設置到obj
null
。
(見Can someone explain this javascript memory leak scenario to me用於解釋爲什麼這將創建一個內存泄漏)
現在,我很可能失去了一些東西,因此這個問題,但不是這個也是會發生什麼當您添加一個jQuery的事件處理程序:
<html>
<body>
<script type="text/javascript">
$(window).load(function() {
$("element").on("click",function() {
alert("Will this also leak?");
});
};
</script>
<button id="element">Click Me</button>
</body>
</html>
你有基本內同一click-handler
,對不對?
我知道你不會創建var obj
,但代碼仍會創建一個jQuery對象。
我真的添加了一個內存泄漏與我添加的每個jQuery處理程序?
還是我完全誤解了這兩種情況?
沒有答案,但會推薦閱讀https://developers.google.com/web/tools/chrome-devtools/profile/memory-problems/memory-diagnosis?hl=en和https:// developer .chrome.com/devtools/docs/heap-profiling – juvian
在他們的例子中,這是一個泄漏,但它只會發生一次。內存泄漏只是一個問題,如果它重複出現。即如果你有(說)基於網絡的聊天,並且你的更新消息窗口的方法導致泄漏,那麼是的,當消息進入時你最終會耗盡內存。但是如果一個可泄漏事件只發生在一次頁面的生命週期,那麼它不會是一個問題。 –
該文章來自2007年。忘記它。瀏覽器在跨越DOM邊界的循環引用中出現問題已經很長時間了。 – Bergi