Two almost identical AJAX calls, very different performance.

Two almost identical AJAX calls, very different performance.

Hi All,

I have a jQuery AJAX call that is driving me crazy. I hope someone can help. I have list of items in a scrollable div, and when the user scrolls to the bottom, I load more (like the Facebook notifications, which is what I am using as model).

When the scrollbar reaches the bottom, I make the AJAX call, but it takes about 3-4 seconds.

I know it doesnt normally take that long to return things via AJAX for me, so I started to see why.

What I noticed is that, even though the AJAX call takes 3-4 seconds with my real data, if I return another string that is just as long, it works perfectly, much faster.

I have narrowed it down to the AJAX call. It is definitely not the string generation that is server side, and it is not the append that I do after receiving the string. It is the first line in the success function. So, in my code below, the alert is slow with real data, but fast with test data. Both strings are the same size (about 20k characters). The only real difference is that the real data has more divs and BRs, and some of those divs are display:table and display:tablecell. But again, the issue is on the AJAX not the rendering afterwards. Does this make any sense? Does anyone have any ideas? It is driving me crazy for days.

Any help is very much appreciated.

    $.ajax({
    context: this,
    type: "GET",
    url:'ajaxProcess',
    data: 'a=notification-get&num=' + num + '&lid=' + lid,
    success: function(data,textStatus) {
alert(data);