minimize jQuery object creation (v6)

Revision 6 of this benchmark created on

Preparation HTML

<script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js">
</script>
<div id="appRoot">
  <div class="element1">
    element1
  </div>
  <div class="element2">
    element2
  </div>
  <div class="element3">
    element3
  </div>
  <div class="element4">
    element4
  </div>
  <div class="element5">
    element5 
  </div>
  <div class="element6">
    element6
  </div>
</div>

Test runner

Ready to run.

Testing in
TestOps/sec
More jQuery objects
$(function() {

  $(".element1").bind("click", function() {
    $(".element2").text("clicked by 1");
  })

  $(".element3").bind("click", function() {
    $(".element1").text("clicked by 3");
  })
  $(".element6").bind("click", function() {
    $(".element1").text("clicked by 3");
  })
  $(".element4").bind("click", function() {
    $(".element5").text("clicked by 4");
  })

  $(".element1").click();
  $(".element2").click();
  $(".element3").click();
  $(".element4").click();
  $(".element5").click();
  $(".element6").click();
});
ready
Less jQuery Objects
$(function() {

  var appRoot = $(document);


  appRoot.find(".element1").bind("click", function() {
    appRoot.find(".element2").text("clicked by 1");
  })

  appRoot.find(".element3").bind("click", function() {
    appRoot.find(".element1").text("clicked by 3");
  })


  appRoot.find(".element6").bind("click", function() {
    appRoot.find(".element1").text("clicked by 3");
  })


  appRoot.find(".element4").bind("click", function() {
    appRoot.find(".element5").text("clicked by 4");
  })

  appRoot.find(".element1").click();
  appRoot.find(".element2").click();
  appRoot.find(".element3").click();
  appRoot.find(".element4").click();
  appRoot.find(".element5").click();
  appRoot.find(".element6").click();
});
ready

Revisions

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