jQuery.ajax vs custom ajax
JavaScript performance comparison
Preparation code
<script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script>
Benchmark.prototype.setup = function() {
function ajax( uri, settings ) {
var ajax = new window.XMLHttpRequest(),
data = settings.type == 'GET' ? '' : settings.data,
async = settings.async ? settings.async : true;
uri = settings.type == 'GET' ? uri + ( settings.data ? '?' + settings.data : '' ) : uri;
ajax.onreadystatechange = function () {
if ( ajax.readyState == 4 ) { //response ready
if ( ajax.status == 200 ) { //success
if ( settings.success ) settings.success( ajax.responseText, ajax.statusText );
if ( settings.complete ) settings.complete( ajax, ajax.statusText );
} else {
if ( settings.error ) settings.error( ajax, ajax.status, ajax.statusText );
};
};
};
ajax.open( settings.type, uri, async );
if ( settings.headers ) {
for ( var header in settings.headers ) {
ajax.setRequestHeader( header, settings.headers[header] );
};
};
ajax.send( data );
};
};
</script>
Preparation code output
Test runner
Warning! For accurate results, please disable Firebug before running the tests. (Why?)
Java applet disabled.
| Test | Ops/sec | |
|---|---|---|
$.ajax GET |
|
pending… |
custom ajax GET |
|
pending… |
$.ajax POST |
|
pending… |
ajax POST |
|
pending… |
You can edit these tests or add even more tests to this page by appending /edit to the URL.
0 comments