fix a few mistakes. Make sugar work. Roll back to childNodes because children is 10x slower

2 files changed, 96 insertions, 110 deletions

diff --git a/bench/runner.html b/bench/runner.html
index b39c1df..5b6040c 100644
--- a/bench/runner.html
+++ b/bench/runner.html
@@ -38,23 +38,16 @@
   <div id="draw"></div>
   <svg id="native" width="100" height="100" xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:svgjs="http://svgjs.com/svgjs"></svg>
   <script src="../dist/svg.js"></script>
-  <script type="text/javascript" src="../src/helpers.js"></script>
-  <script type="text/javascript" src="../src/transform.js"></script>
-  <script type="text/javascript" src="../src/matrix.js"></script>
-  <script type="text/javascript" src="../src/morph.js"></script>
-  <script type="text/javascript" src="../src/runner.js"></script>
-  <script type="text/javascript" src="../src/timeline.js"></script>
-  <script type="text/javascript" src="../src/controller.js"></script>
   <script src="https://cdnjs.cloudflare.com/ajax/libs/snap.svg/0.5.1/snap.svg-min.js"></script>
   <script src="svg.bench.js"></script>
   <!--<script src="tests/10000-each.js"></script> -->
-  <!-- <script src="tests/10000-rects.js"></script>
-  <script src="tests/10000-circles.js"></script>
+  <script src="tests/10000-rects.js"></script>
+  <!-- <script src="tests/10000-circles.js"></script>
   <script src="tests/10000-paths.js"></script>
   <script src="tests/10000-boxes.js"></script>
   <script src="tests/10000-pointArray-bbox.js"></script>
-  <script src="tests/10000-accesses.js"></script> -->
-  <script src="tests/10000-transform.js"></script>
+  <script src="tests/10000-accesses.js"></script>
+  <script src="tests/10000-transform.js"></script> -->
   <script>
     SVG.bench.run()
   </script>
diff --git a/bench/tests/10000-rects.js b/bench/tests/10000-rects.js
index 98b7ac9..d6ef518 100644
--- a/bench/tests/10000-rects.js
+++ b/bench/tests/10000-rects.js
@@ -17,102 +17,95 @@ SVG.bench.describe('Generate 10000 rects', function(bench) {
   })
 })
 
-
-SVG.bench.describe('Generate 10000 rects with fill', function(bench) {
-  bench.test('using SVG.js v2.5.3', function() {
-    for (var i = 0; i < 10000; i++)
-      bench.draw.rect(100,100).fill('#f06')
-  })
-  bench.test('using vanilla js', function() {
-    for (var i = 0; i < 10000; i++) {
-      var rect = document.createElementNS(SVG.ns, 'rect')
-      rect.setAttributeNS(null, 'height', 100)
-      rect.setAttributeNS(null, 'width', 100)
-      rect.setAttributeNS(null, 'fill', '#f06')
-      bench.raw.appendChild(rect)
-    }
-  })
-  bench.test('using Snap.svg v0.5.1', function() {
-    for (var i = 0; i < 10000; i++)
-      bench.snap.rect(50, 50, 100, 100).attr('fill', '#f06')
-  })
-})
-
-
-SVG.bench.describe('Generate 10000 rects with position and fill', function(bench) {
-  bench.test('using SVG.js v2.5.3', function() {
-    for (var i = 0; i < 10000; i++)
-      bench.draw.rect(100,100).move(50,50).fill('#f06')
-  })
-  bench.test('using vanilla js', function() {
-    for (var i = 0; i < 10000; i++) {
-      var rect = document.createElementNS(SVG.ns, 'rect')
-      rect.setAttributeNS(null, 'height', 100)
-      rect.setAttributeNS(null, 'width', 100)
-      rect.setAttributeNS(null, 'fill', '#f06')
-      rect.setAttributeNS(null, 'x', 50)
-      rect.setAttributeNS(null, 'y', 50)
-      bench.raw.appendChild(rect)
-    }
-  })
-  bench.test('using Snap.svg v0.5.1', function() {
-    for (var i = 0; i < 10000; i++)
-      bench.snap.rect(50, 50, 100, 100).attr('fill', '#f06')
-  })
-})
-
-
-SVG.bench.describe('Generate 10000 rects with gradient fill', function(bench) {
-  bench.test('using SVG.js v2.5.3', function() {
-    for (var i = 0; i < 10000; i++) {
-      var g = bench.draw.gradient('linear', function(add) {
-        add.stop(0, '#000')
-        add.stop(0.25, '#f00')
-        add.stop(1, '#fff')
-      })
-
-      bench.draw.rect(100,100).fill(g)
-    }
-  })
-  bench.test('using vanilla js', function() {
-    for (var i = 0; i < 10000; i++) {
-      var g = document.createElementNS(SVG.ns, 'linearGradient')
-      var stop = document.createElementNS(SVG.ns, 'stop')
-      stop.setAttributeNS(null, 'offset', '0%')
-      stop.setAttributeNS(null, 'color', '#000')
-      g.appendChild(stop)
-      stop = document.createElementNS(SVG.ns, 'stop')
-      stop.setAttributeNS(null, 'offset', '25%')
-      stop.setAttributeNS(null, 'color', '#f00')
-      g.appendChild(stop)
-      stop = document.createElementNS(SVG.ns, 'stop')
-      stop.setAttributeNS(null, 'offset', '100%')
-      stop.setAttributeNS(null, 'color', '#fff')
-      g.appendChild(stop)
-      bench.raw.appendChild(g)
-
-      var rect = document.createElementNS(SVG.ns, 'rect')
-      rect.setAttributeNS(null, 'height', 100)
-      rect.setAttributeNS(null, 'width', 100)
-      rect.setAttributeNS(null, 'fill', '#f06')
-      bench.raw.appendChild(rect)
-    }
-  })
-  bench.test('using Snap.svg v0.5.1', function() {
-    for (var i = 0; i < 10000; i++) {
-      var g = bench.snap.gradient("L(0, 0, 100, 100)#000-#f00:25%-#fff")
-
-      bench.snap.rect(50, 50, 100, 100).attr({
-        fill: g
-      })
-    }
-  })
-})
-
-
-
-
-
-
-
-
+//
+// SVG.bench.describe('Generate 10000 rects with fill', function(bench) {
+//   bench.test('using SVG.js v2.5.3', function() {
+//     for (var i = 0; i < 10000; i++)
+//       bench.draw.rect(100,100).fill('#f06')
+//   })
+//   bench.test('using vanilla js', function() {
+//     for (var i = 0; i < 10000; i++) {
+//       var rect = document.createElementNS(SVG.ns, 'rect')
+//       rect.setAttributeNS(null, 'height', 100)
+//       rect.setAttributeNS(null, 'width', 100)
+//       rect.setAttributeNS(null, 'fill', '#f06')
+//       bench.raw.appendChild(rect)
+//     }
+//   })
+//   bench.test('using Snap.svg v0.5.1', function() {
+//     for (var i = 0; i < 10000; i++)
+//       bench.snap.rect(50, 50, 100, 100).attr('fill', '#f06')
+//   })
+// })
+//
+//
+// SVG.bench.describe('Generate 10000 rects with position and fill', function(bench) {
+//   bench.test('using SVG.js v2.5.3', function() {
+//     for (var i = 0; i < 10000; i++)
+//       bench.draw.rect(100,100).move(50,50).fill('#f06')
+//   })
+//   bench.test('using vanilla js', function() {
+//     for (var i = 0; i < 10000; i++) {
+//       var rect = document.createElementNS(SVG.ns, 'rect')
+//       rect.setAttributeNS(null, 'height', 100)
+//       rect.setAttributeNS(null, 'width', 100)
+//       rect.setAttributeNS(null, 'fill', '#f06')
+//       rect.setAttributeNS(null, 'x', 50)
+//       rect.setAttributeNS(null, 'y', 50)
+//       bench.raw.appendChild(rect)
+//     }
+//   })
+//   bench.test('using Snap.svg v0.5.1', function() {
+//     for (var i = 0; i < 10000; i++)
+//       bench.snap.rect(50, 50, 100, 100).attr('fill', '#f06')
+//   })
+// })
+//
+//
+// SVG.bench.describe('Generate 10000 rects with gradient fill', function(bench) {
+//   bench.test('using SVG.js v2.5.3', function() {
+//     for (var i = 0; i < 10000; i++) {
+//       var g = bench.draw.gradient('linear', function(add) {
+//         add.stop(0, '#000')
+//         add.stop(0.25, '#f00')
+//         add.stop(1, '#fff')
+//       })
+//
+//       bench.draw.rect(100,100).fill(g)
+//     }
+//   })
+//   bench.test('using vanilla js', function() {
+//     for (var i = 0; i < 10000; i++) {
+//       var g = document.createElementNS(SVG.ns, 'linearGradient')
+//       var stop = document.createElementNS(SVG.ns, 'stop')
+//       stop.setAttributeNS(null, 'offset', '0%')
+//       stop.setAttributeNS(null, 'color', '#000')
+//       g.appendChild(stop)
+//       stop = document.createElementNS(SVG.ns, 'stop')
+//       stop.setAttributeNS(null, 'offset', '25%')
+//       stop.setAttributeNS(null, 'color', '#f00')
+//       g.appendChild(stop)
+//       stop = document.createElementNS(SVG.ns, 'stop')
+//       stop.setAttributeNS(null, 'offset', '100%')
+//       stop.setAttributeNS(null, 'color', '#fff')
+//       g.appendChild(stop)
+//       bench.raw.appendChild(g)
+//
+//       var rect = document.createElementNS(SVG.ns, 'rect')
+//       rect.setAttributeNS(null, 'height', 100)
+//       rect.setAttributeNS(null, 'width', 100)
+//       rect.setAttributeNS(null, 'fill', '#f06')
+//       bench.raw.appendChild(rect)
+//     }
+//   })
+//   bench.test('using Snap.svg v0.5.1', function() {
+//     for (var i = 0; i < 10000; i++) {
+//       var g = bench.snap.gradient("L(0, 0, 100, 100)#000-#f00:25%-#fff")
+//
+//       bench.snap.rect(50, 50, 100, 100).attr({
+//         fill: g
+//       })
+//     }
+//   })
+// })
+//