$.each makes IE crawl

Question

Hello,

I am trying to use JSON to populate a div, so I basically run a loop to go through the entire data I get, about 200 records and fill it into a div.

It work great in most browsers, but IE it crawls to the core. Is there some solution to the problem?

Thank you for your time.

Answer 1

Last week I watched a Google Code talk about JavaScript optimization. There was a good discussion about looping, and I think I remember that $.each was slow. Not sure it'll help, but you may want to watch the video.

Answer 2

Are you adding each bit of data to the div at a time? Each addition makes the browser have to call a redraw, which you could save by concatenating and adding it all at the end.

function doStuff(json) {
    $.each(json,function(key, val) {
       $('#myEl').append(val); //redraws every time.
    });
}

function doStuffBetter(json) {
    var html = '';
    $.each(json,function(key, val) {
       html += val;
    });
    $('#myEl').append(html); //only 1 redraw
}