jquery ajax slow response in Google Chrome

Question

I am developing my site by Java. I am using jquery, ajax, like this:

$.ajax({
    dataType: "json",
    url : 'getWords.htm',
    type: 'post',
    async : false,
    data : {dataJSON : JSON.stringify(dataJSON)},
    success : function(words) {
        .....
    }
});

It is working well, but in Chrome it work slowly than Firefox, IE and Opera. In Chrome I have a little delay (about 0.8 sec). When I have four ajax query per one click it is really slow. How do I can fix it?

In firebug I see: sending 5ms, waiting 512ms, receiving 3ms, but in other browsers all the fast.

Thanks.

Answer 1

If you are not loading the content of the .post() on a dynamic generated element try putting it inside window.onload instead of $(document).ready, that had worked for me. Hope it helps!

Update

Being the post() fired with a click() event, the parent element needs to be ready. But you might win some time if you call the post() function outside your $(document).ready and save the results to a javascript variable. That will act as some kind of initialValue which you will need to update from the second time the user click on your element.

Answer 2

Something similar happened to me a while ago, and the response time was different for each browser when calling an AJAX, POST or GET. It turned out to be a huge amount of data that I was passing from the url, "getWords.htm" in your case. A couple of questions that could help to determine what's wrong in your case:

1. How much data are you sending back and what's the format? Try JSON and parse it in the "SUCCESS" function to generate the HTML code/page.
2. How many DOM objects are you trying to generate in one shot? It helps a lot to parse whatever you need on the fly, which is easy to do once you have the JSON on the client side and generate the HTML from there dynamically.