jQuery vs. plain javascript

JavaScript performance comparison

Revision 3 of this test case created

Preparation code

<script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js">
</script>
<input id="test" />
<script>
var
    prepared = document.getElementById("test")
  , $prepared = $("#test")  // How it is actually done in properly written jQuery applications
 ;
</script>

Preparation code output

Test runner

Warning! For accurate results, please disable Firebug before running the tests. (Why?)

Java applet disabled.

Testing in unknown unknown
Test Ops/sec
getElementById("test")
document.getElementById("test").value = "foo";
pending…
jQuery("#test")
$("#test").val("foo");
pending…
getElementById but returning $
$(document.getElementById("test")).val("foo");
pending…
Element.value from $ object
$("#test")[0].value = "foo";
pending…
Prepared getElementById
prepared.value = "foo";
pending…
Prepared jQuery("#test")
$prepared.val("foo");
pending…
El.value from prepared $
$prepared[0].value = "foo";
pending…

Compare results of other browsers

Revisions

You can edit these tests or add even more tests to this page by appending /edit to the URL. Here’s a list of current revisions for this page:

0 comments

Add a comment