jQuery 1.7.1 Ajax and Memory Leak

Question

I already had some problems when I was using jQuery 1.4.2 (http://stackoverflow.com/questions/8158739/ie-memory-leak-and-eval-with-jquery/8176724#8176724)

Now I've updated my jQuery to version 1.7.1, and I have the memory increasing slowly after each iteration.

This is the code I have:

var interval;
function setupdaterate(rate) {
    //if the interval wasn't defined only
    if (interval == undefined) {
        interval = setInterval(updateitems, rate * 1000);
    }
}

function updateitems() {

        $('.updatable').each(function () {
            var data = 'ViewObjectId=' + $(this).attr('objectid');

            $.ajax({
                async: true,
                url: '/Ajax/GetUpdatedViewObjectDataHandler.ashx',
                data: data,
                type: 'POST',
                timeout: 10000
            }).done(function (data) {
                //do the job

            });

          });

}

After 10 seconds all item with the class "updatable" are updated. But for some reason this code leaks some memory.

Is it the best way of using jquery ajax? What could be causing the memory leak behaviour?

How could I figure out where is the problem? Any advice?

Have you tried using an earlier version of jQuery like 1.5 or 1.6.4? — Steven de Salas, Nov 23 '11 at 17:40

score 1 · Answer 1 · answered Nov 23 '11 at 17:59

Cannot tell why it is happening since there is no heap screenshots and no code for done callback but getting rid of all the accidental closures that are happening will at least minimize the memory usage. The below assumes it is run inside global scope/otherwise empty function:

var interval;
function setupdaterate(rate) {
    //if the interval wasn't defined only
    if (interval == undefined) {
    interval = setInterval(updateitems, rate * 1000);
    }
}

function updateDone( data ){
    //do the job
}

function iterator() {
    var data = 'ViewObjectId=' + $(this).attr('objectid');

    $.ajax({
        async: true,
        url: '/Ajax/GetUpdatedViewObjectDataHandler.ashx',
        data: data,
        type: 'POST',
        timeout: 10000
        }).done( updateDone
    );
}

function updateitems() {

    $('.updatable').each( iterator );

}

I can say that when I put a selector inside done callback it leaks. Like this: $('#ID').css('height', 10); I've add exactly that statement and it was leaking as well. — Fabito, Nov 23 '11 at 23:57

score 0 · Accepted Answer · answered Nov 24 '11 at 17:13

Esailija,

I tried your code, and it was working and using the same memory as mine. I notice something today, yesterday I was testing with the IE8 developer tools opened, I'm almost sure it was cause the memory leak. Cause today I'm testing with that closed and the memory usage is quite stable.

I've verified also my code and I have some evals into it, I thought it could be the problem, but no, the problem was realy fault of IE8 developer tools window and the crappy memory management of it.

jQuery 1.7.1 Ajax and Memory Leak

2 Answers2