cloneNode vs createElement (v4)

Revision 4 of this benchmark created by Rhys Brett-Bowen on


Preparation HTML

<script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>

Test runner

Ready to run.

Testing in
TestOps/sec
JS Clone
var a = document.createElement('div');
var b = a.cloneNode(false);
var c = a.cloneNode(false);
var d = a.cloneNode(false);
var e = a.cloneNode(false);
var f = a.cloneNode(false);
ready
JS Create
var a = document.createElement('div');
var b = document.createElement('div');
var c = document.createElement('div');
var d = document.createElement('div');
var e = document.createElement('div');
var f = document.createElement('div');
ready
jQuery Clone
var a = $('<div />');
var b = a.clone();
var c = a.clone();
var d = a.clone();
var e = a.clone();
var f = a.clone();
ready
jQuery Create
var a = $('<div />');
var b = $('<div />');
var c = $('<div />');
var d = $('<div />');
var e = $('<div />');
var f = $('<div />');
ready
cloneNode deep
var a = document.createElement('div');
var b = a.cloneNode(true);
var c = a.cloneNode(true);
var d = a.cloneNode(true);
var e = a.cloneNode(true);
var f = a.cloneNode(true);
ready
jQuery one pass
var tmp = $('<div /><div /><div /><div /><div /><div />');
var a = tmp[0];
var b = tmp[1];
var c = tmp[2];
var d = tmp[3];
var e = tmp[4];
var f = tmp[5];
ready
div innerHTML
var tmp = document.createElement('div');
tmp.innerHTML = '<div></div><div></div><div></div><div></div><div></div><div></div>';
var a = tmp.childNodes[0];
var b = tmp.childNodes[1];
var c = tmp.childNodes[2];
var d = tmp.childNodes[3];
var e = tmp.childNodes[4];
var f = tmp.childNodes[5];
ready

Revisions

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

  • Revision 1: published by Daryl Ginn on
  • Revision 2: published by The Able Few on
  • Revision 3: published by Rhys Brett-Bowen on
  • Revision 4: published by Rhys Brett-Bowen on
  • Revision 10: published by sandeep on