Question

My javascript is quite simple . It just keep calling ajax to download data and display it on my screen. I reuse those DOM element by updating data directly ( using jquery’s $(DIV).empty() function and then appendTo another content). However, after running overnight, my computer hang and seems like keep doing something.

I try to watch the memory consumption by some firefox addon. When running two hours, the memory may grows 200MB , but I am not sure if it’s only caused by my js or other reason.

I have some question about this issue.
1. is there any good way to monitor it (such as how much memory is used by specific web page , how much CPU resource is occupied , and how?)
2. is there any some kinda general way to design js web app to avoid such problem?

thanks, any comment is appreciated!

Answer 1

Certain versions of Firefox use reference counting as a garbage collection strategy. Reference counting is prone to cause memory leaks under certain circumstances.

Internet Explorer and Mozilla Firefox are the two Web browsers most
commonly associated with memory leaks in JavaScript. The culprit in
both browsers is the component object model used to manage DOM
objects. Both the native Windows COM and Mozilla’s XPCOM use
reference-counting garbage collection for memory allocation and
retrieval. Reference counting is not always compatible with the
mark-and-sweep garbage collection used for JavaScript. This article
focuses on ways to work around memory leaks in JavaScript code. See
Resources to learn more about COM layer memory handling in Firefox and
IE.

From http://www.ibm.com/developerworks/web/library/wa-memleak/