SVG appendChild (v2)

Revision 2 of this benchmark created by Alexis Deveria on

Preparation HTML

<script>
  var ns = "http://www.w3.org/2000/svg";
  var svg = document.createElementNS(ns, 'svg');
  document.body.appendChild(svg);
  
  var g1 = document.createElementNS(ns, 'g');
  svg.appendChild(g1);
  
  var g2 = document.createElementNS(ns, 'g');
  svg.appendChild(g2);
  
  var rect_arr = [];
  var len = 20;
  
  for (var i = 0; i < len; i++) {
   var rect = document.createElementNS(ns, 'rect');
   rect.setAttribute('x', i);
   rect.setAttribute('y', i);
   rect.setAttribute('width', i * 2);
   rect.setAttribute('height', i * 3);
   g1.appendChild(rect);
   rect_arr.push(rect);
  }
</script>

Test runner

Ready to run.

Testing in
TestOps/sec
append each child
for (var i = 0; i < len; i++) {
 g2.appendChild(rect_arr[i]);
}
ready
append group
g2.appendChild(g1);
ready

Revisions

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