CODEWITHSUNDEEP
jquery
user1037160
user1037160

Reputation: 31

Jquery Ajax call on IE8 is horribly Slow but very fast in IE9

I know many questions have been raised on JS & Jquery performance on IE. However, none helped me and hence I am forced to ask the question here. I am very new to JS & Jquery. However I am stuck with a problem. My application uses JS & Jquery heavily to render complex UI. The application is supposed to be running on IE (Various versions). The application uses a lot of ajax calls to fetch data and show on UI. The data is generally heavy many DB rows (1000s)...

Problem is, that the ajax calls work fine on IE9 but are terribly slow on IE8. I can not find the reason

Following is the way I call ajax function

ajaxRequestSync("admin/dashboard/alertLog.action", reqData, "logtable", renderAlertText);

Here is this function

function ajaxRequestSync(reqURL, reqData, id, completeFunction) {
alert(completeFunction);

$.ajax( {
    type : "POST",
    url : reqURL,
    data : reqData,
    dataType : "html",
    async : true,
    success : function(responseText) { 
        if(completeFunction == null) {
            renderText(id, responseText);
        }
        else {
            completeFunction(id, responseText);
        }
    },
    error : handleAjaxError
});
}

function renderText(id, msgText) {

if (id == "logtable") {
    var name = id+"Loading";
    hideDivById(name);
    showDivById(id);
}
//ask JQuery to clean text/html/events related to the contents of this node

cleanObject(id);
//ask JQuery to render HTML into this element
$("#" + id).html(msgText);
if(id == "alertdetail" && g_alertLinkStatus == true){
    unBlockSection(id);
    $(document).find('a.alert_link1').removeClass('alert_link1').addClass('alert_link');

}
}

Please let me know how can I make this work faster with IE8. Any help would be greatly appreciated.

Upvotes: 2

Views: 3626

Answers (1)

row1
row1

Reputation: 5578

As discussed in the comments it is not the AJAX calls that are slow, but it is what you are doing with the result of the AJAX call that is slow.

IE8 is going to be slower than IE9 for large DOM manipulations, but 3+ minutes does seem a bit excessive (I have seen times like this in IE 6 & 7).

This performance guide is still applicable to IE 8 and may help.

If the above doesn't help, I would start by trying to determine which part it the slowest. Try commenting out $(document).find('a.alert_link1').removeClass('alert_link1').addClass('alert_link'); and see if that improves the speed by a noticable amount-IE 8 does not support getElementsByClassName, so using jQuery to search for elements of a class will be non-optimal on a large document.

Since msgText is a large HTML string (1000 rows by 10 columns) you may need to break this up (or page the results) i.e. your web service can return an array of rows and you could add these all at once or use setInterval to add them in batches and hopefully not block the UI. If you can break it up then you can use find('a.alert_link1') on the broken up parts and this should increase the speed since you can provide jQuery with a context and not search the entire document.

Upvotes: 1

Related Questions