Speed test: Difference between revisions
From JSXGraph Wiki
A WASSERMANN (talk | contribs) No edit summary |
A WASSERMANN (talk | contribs) No edit summary |
||
Line 6: | Line 6: | ||
</html> | </html> | ||
<jsxgraph width=" | <jsxgraph width="400" height="400" box="box"> | ||
var board, i, p, col; | var board, i, p, col; | ||
board = JXG.JSXGraph.initBoard('box', {boundingbox:[-4,4,4,-4], keepaspectratio: | board = JXG.JSXGraph.initBoard('box', {boundingbox:[-4,4,4,-4], keepaspectratio:false, axis:true}); | ||
p = []; | p = []; | ||
for (i=0;i<2*3+1;i++) { | for (i=0;i<2*3+1;i++) { | ||
Line 51: | Line 51: | ||
}; | }; | ||
</jsxgraph> | </jsxgraph> | ||
=== The underlying JavaScript code === | |||
<source lang="javascript"> | |||
var board, i, p, col; | |||
board = JXG.JSXGraph.initBoard('box', {boundingbox:[-4,4,4,-4], keepaspectratio:false, axis:true}); | |||
p = []; | |||
for (i=0;i<2*3+1;i++) { | |||
if (i%3==0) { | |||
col = 'red'; | |||
} else { | |||
col = 'blue'; | |||
} | |||
if (i==0) { | |||
p.push(board.createElement('point',[-3,3], {size:8, strokeColor:col, fillColor:col})); | |||
} else { | |||
p.push(board.createElement('point',[Math.random()*8-4,Math.random()*8-4],{size:8, strokeColor:col,fillColor:col})); | |||
} | |||
} | |||
var c = board.createElement('curve', JXG.Math.Numerics.bezier(p),{strokecolor:'blue', name:"curve", strokeWidth:5, lastArrow:true}); | |||
count = 0; | |||
maxcount = 1000; | |||
sgn = 1; | |||
startTime = 0; | |||
unit = function() { | |||
var len = p.length, | |||
j = Math.floor(len*Math.random()), | |||
now; | |||
p[j].setPosition(JXG.COORDS_BY_USER, sgn*3*Math.random(), -sgn*3*Math.random()); | |||
board.update(); | |||
sgn *= -1; | |||
count++; | |||
if (count%100==0) { | |||
now = new Date(); | |||
document.getElementById('output').innerHTML = "Update speed: " + (Math.round(100*(1000*count/(now.getTime()-startTime.getTime())))/100.0) + ' fps'; | |||
} | |||
if (count<maxcount) | |||
setTimeout(unit,0); | |||
} | |||
speedtest = function() { | |||
count = 0; | |||
startTime = new Date(); | |||
var ti = setTimeout(unit,0); | |||
}; | |||
</source> | |||
[[Category:Examples]] | |||
[[Category:Interpolation]] |
Revision as of 10:20, 7 September 2011
Benchmarking the speed of your browser. This application does 1000 updates of a JSXGraph construction. The main cpu work is spent on computing the Bezier curve and plot it and on updating the SVG image of the construction.
Update speed: - fps
The underlying JavaScript code
var board, i, p, col;
board = JXG.JSXGraph.initBoard('box', {boundingbox:[-4,4,4,-4], keepaspectratio:false, axis:true});
p = [];
for (i=0;i<2*3+1;i++) {
if (i%3==0) {
col = 'red';
} else {
col = 'blue';
}
if (i==0) {
p.push(board.createElement('point',[-3,3], {size:8, strokeColor:col, fillColor:col}));
} else {
p.push(board.createElement('point',[Math.random()*8-4,Math.random()*8-4],{size:8, strokeColor:col,fillColor:col}));
}
}
var c = board.createElement('curve', JXG.Math.Numerics.bezier(p),{strokecolor:'blue', name:"curve", strokeWidth:5, lastArrow:true});
count = 0;
maxcount = 1000;
sgn = 1;
startTime = 0;
unit = function() {
var len = p.length,
j = Math.floor(len*Math.random()),
now;
p[j].setPosition(JXG.COORDS_BY_USER, sgn*3*Math.random(), -sgn*3*Math.random());
board.update();
sgn *= -1;
count++;
if (count%100==0) {
now = new Date();
document.getElementById('output').innerHTML = "Update speed: " + (Math.round(100*(1000*count/(now.getTime()-startTime.getTime())))/100.0) + ' fps';
}
if (count<maxcount)
setTimeout(unit,0);
}
speedtest = function() {
count = 0;
startTime = new Date();
var ti = setTimeout(unit,0);
};