better-dom vs jquery: classes manipulation (v2)

Revision 2 of this benchmark created on

Description

Compare performance of the better-dom library and jquery in typical cases

Preparation HTML

<script src="//ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.js"></script>
<script src="//rawgithub.com/chemerisuk/better-dom/v1.6.0/dist/better-dom.js"></script>
<script>
var nativeSandbox = document.createElement("div"),
    jquerySandbox = $(nativeSandbox),
    domSandbox = DOM.create(nativeSandbox),
    className = "t" + new Date().getTime();

document.body.appendChild(nativeSandbox);
</script>
<select on-change='testing'>
  <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="mercedes">Mercedes</option>
  <option value="audi">Audi</option>
</select>

Test runner

Ready to run.

Testing in
TestOps/sec
jquery#addClass
jquerySandbox.addClass("a" + new Date().getTime());
nativeSandbox.className = "";
ready
DOM#addClass
domSandbox.addClass("a" + new Date().getTime());
nativeSandbox.className = "";
ready
jquery#addClasses
jquerySandbox.addClass("a" + new Date().getTime() + " b" + new Date().getTime() + " c" + new Date().getTime() + " d" + new Date().getTime());
nativeSandbox.className = "";
ready
DOM#addClasses
domSandbox.addClass("a" + new Date().getTime(), "b" + new Date().getTime(), "c" + new Date().getTime(), "d" + new Date().getTime());
nativeSandbox.className = "";
ready
jquery#toggleClass
jquerySandbox.toggleClass(className);
ready
DOM#toggleClass
domSandbox.toggleClass(className);
ready
jquery
$(document).delegate('[on-change]', 'change', function() {
  var $self, url, value;
  $self = $(this);
  url = $self.attr('on-change');
  value = $self.val();
});
 
ready
dom
$(document).on('change', '[on-change]', function() {
  var $self, url, value;
  $self = $(this);
  url = $self.attr('on-change');
  value = $self.val();
});
ready

Revisions

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

  • Revision 1: published by Maksim Chemerisuk on
  • Revision 2: published on
  • Revision 3: published by Maksim Chemerisuk on
  • Revision 5: published on
  • Revision 6: published by Maksim Chemerisuk on