aboutsummaryrefslogtreecommitdiffstats
path: root/bench
diff options
context:
space:
mode:
Diffstat (limited to 'bench')
-rw-r--r--bench/runner.html5
-rw-r--r--bench/svg.bench.js13
-rw-r--r--bench/tests/element-creation.js44
3 files changed, 54 insertions, 8 deletions
diff --git a/bench/runner.html b/bench/runner.html
index 0ede94f..4c40208 100644
--- a/bench/runner.html
+++ b/bench/runner.html
@@ -7,15 +7,18 @@
font-family: 'Helvetica Light', Helvetica, sans-serif;
font-weight: 300;
}
- #draw {
+ svg {
width: 2px;
height: 2px;
overflow: hidden;
+ position: fixed;
+ right: 0;
}
</style>
</head>
<body>
<div id="draw"></div>
+ <svg id="native" width="100" height="1000" 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 src="svg.bench.js"></script>
<script src="tests/element-creation.js"></script>
diff --git a/bench/svg.bench.js b/bench/svg.bench.js
index 3f12f30..653d438 100644
--- a/bench/svg.bench.js
+++ b/bench/svg.bench.js
@@ -6,6 +6,7 @@
, _before: function() {}
, _after: function() {}
, draw: SVG('draw')
+ , raw: document.getElementById('native')
// Add test
, test: function(name, closure) {
@@ -45,7 +46,10 @@
this.write( this._tests[i].name, ( new Date ).getTime() - s )
// run after
- this._after(this._tests[i])
+ this._after(this._tests[i])
+
+ // clear everything
+ this.clear()
}
}
@@ -71,6 +75,13 @@
return pad
}
+
+ // Clear canvasses
+ , clear: function() {
+ while(this.raw.hasChildNodes())
+ this.raw.removeChild(this.raw.lastChild)
+ this.draw.clear()
+ }
}
})(); \ No newline at end of file
diff --git a/bench/tests/element-creation.js b/bench/tests/element-creation.js
index 6e35a08..107c353 100644
--- a/bench/tests/element-creation.js
+++ b/bench/tests/element-creation.js
@@ -1,18 +1,50 @@
-;(function(bench) {
-
- bench.test('generate 10000 rects', function() {
+(function(bench) {
+ var svgns = 'http://www.w3.org/2000/svg'
+
+ bench.test('svg.js: generate 10000 rects', function() {
for (var i = 0; i < 10000; i++)
bench.draw.rect(100,100)
})
- bench.test('generate 10000 rects with fill', function() {
+ bench.test('native: generate 10000 rects', function() {
+ for (var i = 0; i < 10000; i++) {
+ var rect = document.createElementNS(svgns, 'rect')
+ rect.setAttributeNS(null, 'height', 100)
+ rect.setAttributeNS(null, 'width', 100)
+ bench.raw.appendChild(rect)
+ }
+ })
+
+ bench.test('svg.js: generate 10000 rects with fill', function() {
for (var i = 0; i < 10000; i++)
bench.draw.rect(100,100).fill('#f06')
})
- bench.test('generate 10000 rects with position and fill', function() {
+ bench.test('native: generate 10000 rects with fill', function() {
+ for (var i = 0; i < 10000; i++) {
+ var rect = document.createElementNS(svgns, 'rect')
+ rect.setAttributeNS(null, 'height', 100)
+ rect.setAttributeNS(null, 'width', 100)
+ rect.setAttributeNS(null, 'fill', '#f06')
+ bench.raw.appendChild(rect)
+ }
+ })
+
+ bench.test('svg.js: generate 10000 rects with position and fill', function() {
for (var i = 0; i < 10000; i++)
bench.draw.rect(100,100).move(50,50).fill('#f06')
})
-})(SVG.bench); \ No newline at end of file
+ bench.test('native: generate 10000 rects with position and fill', function() {
+ for (var i = 0; i < 10000; i++) {
+ var rect = document.createElementNS(svgns, '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)
+ }
+ })
+
+})(SVG.bench) \ No newline at end of file