DOM creation libraries (v25)

Revision 25 of this benchmark created by Forest on


Description

Tests a number of ways of generating DOM.

Just a version bump to reset stats after a change to crel.

Preparation HTML

<script src="https://rawgithub.com/forestrf/crel2/master/crel2.js">
</script>
<script src="https://dl.dropboxusercontent.com/u/1630604/crel2.js">
</script>

Setup

var testDiv = crel2('div', ['class', 'testDiv']);

Teardown


    testDiv.remove();
  

Test runner

Ready to run.

Testing in
TestOps/sec
crel2
testDiv.appendChild(
crel2('section', crel2('h1', "A title"), crel2('h2', "A sub title"), crel2('br'), crel2('button', [
  "class", "things"
], "THING1"), crel2('button', [
  "class", "things"
], "THING2"), crel2('button', [
  "class", "things"
], "THING3"), crel2('button', [
  "class", "things"
], "THING4"), crel2('button', [
  "class", "things"
], "THING5"), crel2('button', [
  "class", "things"
], "THING6"), crel2('span', [
  "class", "majigger"
], crel2('a', [
  "href", "http://www.google.com"
], "A link")), "Blady bla bla, some text and that.", crel2('table', [
  "id", "initialtests"
], crel2('thead', crel2('tr', crel2('th', "Column header"), crel2('th', "another one"), crel2('th', "AND ANOTHER"), crel2('th', "OMG SO MANY COLUMN HEADERS"))), crel2('tbody', crel2('tr', crel2('td', "1"), crel2('td', "2"), crel2('td', "3"), crel2('td', "4"))))));
ready
crel2 nuevo
testDiv.appendChild(
crel3('section', crel3('h1', "A title"), crel3('h2', "A sub title"), crel3('br'), crel3('button', [
  "class", "things"
], "THING1"), crel3('button', [
  "class", "things"
], "THING2"), crel3('button', [
  "class", "things"
], "THING3"), crel3('button', [
  "class", "things"
], "THING4"), crel3('button', [
  "class", "things"
], "THING5"), crel3('button', [
  "class", "things"
], "THING6"), crel3('span', [
  "class", "majigger"
], crel3('a', [
  "href", "http://www.google.com"
], "A link")), "Blady bla bla, some text and that.", crel3('table', [
  "id", "initialtests"
], crel3('thead', crel3('tr', crel3('th', "Column header"), crel3('th', "another one"), crel3('th', "AND ANOTHER"), crel3('th', "OMG SO MANY COLUMN HEADERS"))), crel3('tbody', crel3('tr', crel3('td', "1"), crel3('td', "2"), crel3('td', "3"), crel3('td', "4"))))));
ready

Revisions

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