Recently encountered a relatively interesting, yet annoying issue… Memory Leaks… I can say that it is an invisible bomb to developers, especially dealing with IE and JQuery.
So, what is memory leak? In simple words, it means your system’s physical memory cannot be released or recovered after usage. How does it affects applications? Well, if memory continuously being consumed, your app will become slower… the worse, KOed… Detailed explanation here.
IE already has a history of memory leak issues, especially working with AJAX and JavaScripts. But, how does this happen? Well, IE’s garbage collection mechanism is the main culprit… IE employs separate garbage collector: 1 for DOM and 1 for Javascript. Subsequently, jQuery’s memory management does not adapt with IE’s way of garbage collection. Jquery relies on DOM and it works by bonding DOM objects with events. Thus, after the usage of javascript, the garbage collector cannot efficiently release events from DOM (Since DOM Gargabe Collector is separated from JS’)… unless you refresh the entire page then they will be released.
So, to fix this we have to alter JQuery library to clean DOM events. A solution by Kossovsky Alexander fixes the .remove() method of jQuery to effectively manage memory consumption.
Now another problem comes in… AJAX… If memory can only be released on page unload or refresh, how about AJAX loaded contents? In such case, we have to be wary of utilizing AJAX methods in IEs.
Below are some tips in handling memory leak:
1. When creating DOM objects dynamically, remember to remove them when not needed.
2. When loading dynamic contents via AJAX, remember to unload them when not needed.
3. Clear variables when not necessary needed.
Any more to add in?
