Hopiu/fabric.js
1
0
Fork 0
mirror of https://github.com/Hopiu/fabric.js.git synced 2026-05-15 09:13:11 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Add links to benchmarks in readme; modify simple shapes benchmark to be able to chose number of shapes.

Browse source
This commit is contained in:
kangax 2011-02-09 02:27:25 -05:00
parent 0a1c52408d
commit d42ba6ec02
2 changed files with 24 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
README.md
View file

@ -60,6 +60,9 @@ Fabric.js started as a foundation for design editor on [printio.ru](http://print
- [Main demo](http://kangax.github.com/fabric.js/test/demo/)
- [Benchmark (quantity)](http://kangax.github.com/fabric.js/test/benchmarks/quantity.html)
- [Benchmark (animation)](http://kangax.github.com/fabric.js/test/benchmarks/animation.html)
- [Benchmark (Raphael vs. Fabric; simple shapes)](http://kangax.github.com/fabric.js/test/raphael_vs_fabric/simple_shapes.html)
- [Benchmark (Raphael vs. Fabric; complex shape 1)](http://kangax.github.com/fabric.js/test/raphael_vs_fabric/complex_shape.html)
- [Benchmark (Raphael vs. Fabric; complex shape 2)](http://kangax.github.com/fabric.js/test/raphael_vs_fabric/complex_shape_2.html)
### Documentation

24
test/raphael_vs_fabric/simple_shapes.html
View file

@ -11,6 +11,7 @@
border: 1px solid #000;
position: relative;
}
ul, ul li { display: inline-block; }
</style>
<script src="raphael-min.js"></script>
<script src="../../dist/all.js"></script>
@ -19,7 +20,7 @@
return Math.random() * (max - min) + min;
}
var numObjects = 200,
var numObjects = parseInt(document.location.search.slice(1), 10) || 200,
radius = 20,
width = 500,
height = 500;
@ -28,9 +29,11 @@
var logEl = document.getElementById('log');
document.getElementById('numshapes').innerHTML = numObjects;
(function testRaphael() {
var paper = Raphael(550, 50, width, height),
var paper = Raphael(550, 57, width, height),
startTime = new Date(),
circle;
@ -86,10 +89,25 @@
})();
};
function reload(num) {
document.location.href = document.location.href.replace(/\?\d+$/, '?' + num);
}
</script>
</head>
<body>
<p>Rendering a large number of simple shapes</p>
<div>
Rendering a large number (<span id="numshapes"></span>) of simple shapes
<ul>
<li><a href="#" onclick="reload(10)">10 shapes</a></li>
<li><a href="#" onclick="reload(100)">100 shapes</a></li>
<li><a href="#" onclick="reload(500)">500 shapes</a></li>
<li><a href="#" onclick="reload(1000)">1000 shapes</a></li>
<li><a href="#" onclick="reload(2000)">2000 shapes</a></li>
<li><a href="#" onclick="reload(5000)">5000 shapes</a></li>
</ul>
</div>
<canvas id="canvas" width="500" height="500"></canvas>
<p id="log"></p>
</body>