jQuery vs Closure

Benchmark created by azumaxoid on

Preparation HTML

<script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script><script src="http://closure-library.googlecode.com/svn/trunk/closure/goog/base.js"></script>
<script>
goog.require('goog.dom');
goog.require('goog.dom.query');
</script>
<div class="content">
<span>
<div class="item">hogehoge</div>
</span>
</div>
<div class="content2">
</div>

Test runner

Ready to run.

Testing in
TestOps/sec
jquerySelector1
var str = jQuery(".item")[0];
ready
jquerySelector2
var str = jQuery(".content span .item")[0];
ready
closureSelector1
var str = goog.dom.query(".item");
ready
closureSelector2
var str = goog.dom.query(".content span .item");
ready
closure1
var str = goog.dom.getElementByClass("item");
ready
closure2
var str = goog.dom.getElementByClass("item", goog.dom.getElementByClass("content").getElementsByTagName("span")[0]);
ready
Native1
var str = document.getElementsByClassName("item")[0];
ready
Native2
var str = document.getElementsByClassName("content")[0].getElementsByTagName("span")[0].getElementsByClassName("item")[0];
ready
querySelector1
var str = document.querySelector(".content span .item");
ready
querySelector2
var str = document.querySelector(".item");
ready

Revisions

You can edit these tests or add more tests to this page by appending /edit to the URL.

  • Revision 1: published by azumaxoid on