rmesserle: DollarDom vs jQuery (v6)

Revision 6 of this benchmark created by Robert Messerle on


Preparation HTML

<script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js">
</script>
<script>
  /*
 dollarDom jQuery Plugin v2.0
 Copyright 2011 Robert Messerle
 Site: http://dollardom.robertmesserle.com/
 */
  (function($) {
    $.dom = function(str, obj, attr) {
      var tag = str.match(/^[\w\d]+/i)[0],
          classes = str.match(/\.[\w\d\-\_]+/gi),
          id = str.match(/\#[\w\d\-\_]+/),
          attrs = str.match(/\[[\"\']?[\w\d\-\_]+[\"\']?\=[\"\']?[^\"\'\]]+[\"\']?\]/gi),
          elem = document.createElement(tag),
          $elem = $(elem),
          i;
      if (classes) elem.className = classes.join('').substring(1).replace(/\./g, ' ');
      if (id && id[0]) elem.id = id[0].substring(1);
      if (attrs) setAttributes(elem, attrs);
      if (attr) setAttributes(elem, attr);
      if (obj) for (i in obj) if ($elem[i]) $elem[i](obj[i]);
      return $elem;
    };

    function setAttributes(elem, attrs) {
      var len, split;
      if (attrs instanceof Array && (len = attrs.length)) {
        while (len--) {
          split = attrs[len].split(/[\[\]\=]/g);
          setAttribute(elem, split[1], split[2]);
        }
      } else {
        for (var i in attrs) setAttribute(elem, i, attrs[i]);
      }
    }

    function setAttribute(elem, key, value) {
      if (key === 'class') elem.className = value;
      else elem.setAttribute(key, value);
    }
  })(jQuery);
</script>

Test runner

Ready to run.

Testing in
TestOps/sec
jQuery
$('<a/>', {
  id: 'link',
  text: 'howdy',
  'class': 'holy_smokes',
  href: '#',
  css: {
    color: 'red'
  },
  click: function() {
    alert('hi');
  }
});
ready
dollarDom
$.dom('a#link.holy_smokes[href=#]', {
  css: {
    color: 'red'
  },
  click: function() {
    alert('hi');
  }
});
ready

Revisions

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