Huge Web App With Memory Leak in IE 6

问题:

I have a huge web app that is having issues with memory leak in IE 6.

Fixing a memory leak in a 5 line code sample that demonstrates the problem is easy.

But if I have a very huge application, where should a start from?

回答1:

Check out Drip. That usually takes the guesswork out of IE memory leaks.

If for some reason Drip doesn't find it, take a close look at any JavaScript code that works with events. That is almost always the source of any significant memory leak in a browser.

Destroying a DOM element with handlers attached to it, without removing those handlers first, will prevent the memory associated with those handlers from being recovered.

回答2:

Does the application use a lot of JavaScript?

If it does, then one thing I've found that helps for avoiding memory leaks is to make sure you're using a JavaScript framework such as Prototype or jQuery because they have tried and tested event-handling code that doesn't leak memory.

• IE6 can also leak memory if you have circular references to DOM objects
• Also try this JavaScript Memory Leak Detector and see if you can diagnose where the problem is

回答3:

Here is how I solved the memory leak problem in IE7. The idea is to dispose/set to null all expando-properties on all DOM nodes at unloading the page. This worked for me. You may find it useful.

<!--[if lt IE 8]>
<script type="text/javascript">

function disposeAll() {
    if (window.document.all) {
        for (var index = 0; index < window.document.all.length; index++) {
            try { dispose(window.document.all[index], []); } catch (e) { debugger; }
        }
    }
    dispose(window.document.body, []);
    dispose(window.document, []);
    dispose(window, []);
    window.disposeAll = null;
    window.dispose = null;
    window.onunload = null;
}

function dispose(something, map) {
    if (something == null) return;
    if (something.dispose && typeof (something.dispose) == 'function') {
        try { something.dispose(); } catch (e) { debugger; }
    }
    map.push(something);
    for (var key in something) {
        var value = null;
        try { value = something[key]; } catch (e) { };
        if (value == null || value == dispose || value == disposeAll) continue;

        var processed = null;
        for (var index = 0; index < map.length; index++) {
            if (map[index] === value) {
                processed = value;
                break;
            }
        }
        if (processed != null) continue;
        var constructor = value.constructor;
        if (constructor == Object || constructor == Array) {
            try { dispose(value, map); } catch (e) { debugger; }
        }
        if (constructor == Object || constructor == Array || constructor == Function) {
            try { something[key] = null; } catch (e) { debugger; }
        }
    }
    map.pop();
}

(function() {
    var previousUnloadHandler = window.onunload;
    if (previousUnloadHandler == null) {
        window.onunload = disposeAll;
    } else {
        window.onunload = function() {
            previousUnloadHandler.apply(this, arguments); // <== HERE YOU MAY WANT TO HAVE AN "IF" TO MAKE SURE THE ORIGINAL UNLOAD EVENT WASN'T CANCELLED
            disposeAll();
            previousUnloadHandler = null;
        };
    }
}());

</script>
<![endif]-->

You may want to remove all "debugger;" statements if you don't feel like dealing with some occasional exceptions.

回答4:

You're leaking memory from Java functions?

Here's a solution: Take your homebrew java and chuck it. Use one of the standard javascript frameworks, such as jQuery.

If you're doing complex javascript and aren't a java guru, don't do it yourself.

Edit: What, is that bad advice? Javascript isn't just a simple scripting language; its a complex and surprisingly powerful programming language that is closely linked to the HTML DOM, which is implemented differently in different browsers. If you do it wrong, you will not only leak memory but also throw errors everywhere and generally make the browsing experience awful. Do you want to drive away the people coming to your website? No? Then use a javascript framework and get rid of all your hacky cross-browser bullshittery.