Preparation code

<script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js">
</script>
<script>
  Benchmark.prototype.setup = function() {
    var items = {
      0: "zero",
      1: "one",
      2: "two",
      3: "three",
      4: "four",
      5: "five",
      6: "six",
      7: "seven",
      8: "eight",
      9: "nine",
      a: "alpha",
      b: "bravo",
      c: "charlie",
      d: "delta",
      e: "echo",
      f: "foxtrot",
      g: "golf",
      h: "hotel",
      i: "india",
      j: "juliet",
      k: "kilo",
      l: "lima",
      m: "mike",
      n: "november",
      o: "oscar",
      p: "papa",
      q: "quebec",
      r: "romeo",
      s: "sierra",
      t: "tango",
      u: "uniform",
      v: "victor",
      w: "whiskey",
      x: "x-ray",
      y: "yankee",
      z: "zulu"
    };
  };

  Benchmark.prototype.teardown = function() {
    $('.mylist').remove();
  };
</script>

Test runner

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

Java applet disabled.

var list = $('<ul class="mylist"></ul>').appendTo(document.body);
$.each(items, function(k, v) {
  $('<li data-foo="' + k + '">' + v + '</li>').appendTo(list);
});

var list = $('<ul class="mylist"></ul>');
$.each(items, function(k, v) {
  $('<li data-foo="' + k + '">' + v + '</li>').appendTo(list);
});
list.appendTo(document.body);

var list = $(document.createDocumentFragment()),
    ul = $('<ul class="mylist"></ul>');
$.each(items, function(k, v) {
  $('<li data-foo="' + k + '">' + v + '</li>').appendTo(list);
});
list.appendTo(ul);
ul.appendTo(document.body)

var list = '<ul class="mylist">';
$.each(items, function(k, v) {
  list += '<li data-foo="' + k + '">' + v + '</li>';
});
list += "</ul>";
$(list).appendTo(document.body);

var list = document.createElement('ul');
list.className = "mylist";
$.each(items, function(k, v) {
  var li = document.createElement('li');
  li.setAttribute('data-foo', k);
  list.appendChild(li);
});
document.body.appendChild(list);

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:

• Revision 1: published by Rodney on 13th December 2011
• Revision 2: published on 13th December 2011
• Revision 4: published on 14th December 2011

0 comments