jQuery ajax posting large data is slow in Chrome and Safari

Question

I have to make a bandwidth test with javascript and php, I use jQuery, and try all browsers, but:

• Firefox - UP: 7-8 Mbps
• Explorer 9 - UP: 7-8 Mbps
• Opera - UP: 7-8 Mbps
• Safari - UP: sometimes 800-900 kbps
• Chrome - UP: 100-200 kbps or no data

Have you any idea to increase the performance of these browsers or other good technology to measure speed?

sendFile: function (s, d, m){ // size, data, metric
    m++; // how many times I tried to post data
    console.log('m: '+m);
    time = new Date(); 
    endTime3=time.getTime(); // execute time start
    if(s<=65536){
        $.ajax({
            type : 'POST',
            url : '/vegpont/savszelesseg/',
            timeout: 30000,
            dataType: 'text',
            cache: false,
            data: {
                index : 3,
                text: d // large data, min 512 KB to 
            },
            success : function(data){
                console.log('kB: '+s);
                time = new Date(); 
                endTime4=time.getTime(); // execute time end
                console.log('sec: '+(endTime4-endTime3)/1000);
                if(((endTime4-endTime3)/1000)<sec){ // sec now equals 4
                    speedTest.createFile(s*2, m); // create a data which is 's' (aka size) large then call this sendfile method
                }else{
                    var delta=(endTime4-endTime3)/1000;
                    var res=Math.round(s/delta);
                    $('div#speedResult3').html('<b>UP:</b><br/>kB: '+s+', '+
                    'sec: '+delta+'<br/>' +
                    '<b>~ '+res*8+' kbps</b>');
                    $('div#speedResult3').slideDown(1000);
                    $('div.buttonContainer').unblock();
                }

            },
            error : function(XMLHttpRequest, textStatus, errorThrown) {
                if(textStatus=='timeout'){
                    if(m>10){
                        $('div#speedResult3').html('<b>UP:</b><br/>sikertelen mérés');
                        $('div#speedResult3').slideDown(1000);
                        $('div.buttonContainer').unblock();
                    }
                    else{
                        speedTest.createFile(s, m); // create a data which is 's' (aka size) large then call this sendfile method
                    }
                }
            }
        });
    }else{ ...

Answer 1

From my personal experience JQuery (and most webkits) are bloated and causes a multitude of issues because they are more concerned with re-inventing the wheel to make their own crossbrowser version of a functionality than to provide an optimized extension of what is detected to be missing. To that end there is a lot of extra overhead these webkits (aka. javascript api's) create for a multitude of reasons.

I reccomend that you try pure javascript native AJAX calls to see what the performance is like.

Links how to accomplish this with pure javascript:

http://www.javascriptkit.com/dhtmltutors/ajaxgetpost.shtml

http://www.openjs.com/articles/ajax_xmlhttp_using_post.php