190 lines
5.5 KiB
HTML
190 lines
5.5 KiB
HTML
|
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
|
||
|
"http://www.w3.org/TR/html4/strict.dtd">
|
||
|
<html>
|
||
|
<head>
|
||
|
<title>Dojo interactive benchmark tool</title>
|
||
|
<script type="text/javascript" src="../../dojo/dojo.js"></script>
|
||
|
<script type="text/javascript">
|
||
|
// FIXME:
|
||
|
// the url below points to dojo.inpdx.net/benchResults.php
|
||
|
// need to setup DB on dtk.org and change URL here to store
|
||
|
// results elsewhere ... work db structure in accompanying
|
||
|
// .php file
|
||
|
// basic stats are located at http://dojo.inpdx.net/benchmarks.html
|
||
|
|
||
|
dojo.require("dojo.fx");
|
||
|
// FIXME: this seems an excessive fix for IE6 issue ...
|
||
|
dojo.require("dijit.dijit");
|
||
|
// dojo.require("dijit.form.Button");
|
||
|
dojo.require("dijit.dijit-all");
|
||
|
dojo.require("dojo.parser");
|
||
|
|
||
|
|
||
|
// setup global variables
|
||
|
var masterResults = { clientNavigator: navigator.userAgent, dataSet: [], errors: [] }
|
||
|
var isRunning = false;
|
||
|
var theCount, theClass, runner = null;
|
||
|
var testCount = 0;
|
||
|
dojo.addOnLoad(function(){
|
||
|
theCount = dojo.byId('countNode');
|
||
|
theClass = dojo.byId('classNode');
|
||
|
runner = dojo.byId('runner');
|
||
|
masterResults.dojoVersion = dojo.version.toString();
|
||
|
});
|
||
|
|
||
|
|
||
|
function _toggleRunMsg(){
|
||
|
var newMsg = (isRunning) ? " Run Test " : " Running ..."
|
||
|
dojo.fx.chain([
|
||
|
dojo.fadeOut({
|
||
|
node:runner,
|
||
|
duration:200,
|
||
|
onEnd: function(){
|
||
|
runner.innerHTML = newMsg;
|
||
|
isRunning=!isRunning;
|
||
|
}
|
||
|
}),
|
||
|
dojo.fadeIn({ node:runner, duration: 200 })
|
||
|
]).play();
|
||
|
}
|
||
|
|
||
|
function runTest(){
|
||
|
if(isRunning){ return; }
|
||
|
_toggleRunMsg();
|
||
|
setTimeout(function(){_runRealTest();},1000);
|
||
|
}
|
||
|
|
||
|
function _runRealTest(){
|
||
|
|
||
|
var _error = false;
|
||
|
var count = theCount.value;
|
||
|
var aclass = theClass.value.toString();
|
||
|
var theMethod = (dojo.byId('parse').checked) ? "parse" : "create";
|
||
|
|
||
|
var tmpNode = document.createElement('div');
|
||
|
|
||
|
switch(theMethod){
|
||
|
case "parse" :
|
||
|
var tmpString = [];
|
||
|
for(var i=0; i<count; i++){
|
||
|
tmpString.push('<div dojoType="', aclass, '"></div>');
|
||
|
}
|
||
|
tmpNode.innerHTML = tmpString.join("");
|
||
|
var tmpTimer = new Date().getTime();
|
||
|
dojo.parser.parse(tmpNode);
|
||
|
var endTime = new Date().getTime() - tmpTimer;
|
||
|
break;
|
||
|
case "create" :
|
||
|
var construction = dojo.getObject(aclass);
|
||
|
var tmpTimer = new Date().getTime();
|
||
|
for(var i=0; i<count; i++){
|
||
|
var tmp = new construction({});
|
||
|
tmpNode.appendChild(tmp.domNode);
|
||
|
}
|
||
|
var endTime = new Date().getTime() - tmpTimer;
|
||
|
break;
|
||
|
}
|
||
|
|
||
|
var average = (endTime / count);
|
||
|
var msg = "It took: "+endTime+"ms to "+theMethod+" "+count+" "+aclass+" widgets"+
|
||
|
"<br>(average: "+average+" ms/widget)<br><br>";
|
||
|
|
||
|
masterResults.dataSet.push({
|
||
|
testNum: ++testCount,
|
||
|
dijit: aclass,
|
||
|
testCount: count,
|
||
|
testAverage: average,
|
||
|
testMethod: theMethod,
|
||
|
testTime: endTime
|
||
|
});
|
||
|
|
||
|
dojo.byId("results").innerHTML += msg;
|
||
|
setTimeout(function(){_toggleRunMsg();},250);
|
||
|
|
||
|
// Nodes have to be in the document for IE7 to GC them.
|
||
|
// Do this after generating the widgets to dispel
|
||
|
// notion that widget parents have to be in document
|
||
|
// a-priori.
|
||
|
dojo.byId("limbo").appendChild(tmpNode);
|
||
|
}
|
||
|
|
||
|
function doDebug(){
|
||
|
var key = escape(dojo.toJson(masterResults));
|
||
|
dojo.byId('hiddenHolder').value = key;
|
||
|
return true;
|
||
|
}
|
||
|
|
||
|
</script>
|
||
|
<style>
|
||
|
@import "../../dijit/themes/tundra/tundra.css";
|
||
|
@import "../../dijit/themes/dijit.css";
|
||
|
@import "../../dojo/resources/dojo.css";
|
||
|
@import "../../dijit/tests/css/dijitTests.css";
|
||
|
|
||
|
#limbo {
|
||
|
display: none;
|
||
|
}
|
||
|
#theContainer {
|
||
|
float:left;
|
||
|
display: block; padding:12px; padding-top:0;
|
||
|
width:420px; margin-left:20px;
|
||
|
background-color:#fff; -moz-border-radius:8pt 8pt;
|
||
|
border:2px solid #ededed;
|
||
|
}
|
||
|
#leftControl { float:left; width:300px; }
|
||
|
#testControl, #submitControl { border:2px solid #ededed; padding:12px; -moz-border-radius:8pt 8pt; background-color:#fff; }
|
||
|
#results { overflow:auto; height:300px; border:1px solid #ccc; color:darkred; padding:8px; }
|
||
|
#results li { list-style-type: none; }
|
||
|
#results ul { margin:0; padding:0; }
|
||
|
.runHolder, .submitButton {
|
||
|
border:1px solid #ccc; padding:3px; -moz-border-radius:8pt 8pt; text-align:center;
|
||
|
cursor:pointer; background-color:#ededed; display:block; width:125px;
|
||
|
}
|
||
|
|
||
|
</style>
|
||
|
</head>
|
||
|
<body class="tundra">
|
||
|
<div id="limbo"></div>
|
||
|
<h1 class="testTitle">Dojo Benchmark Tool</h1>
|
||
|
|
||
|
<div id="leftControl">
|
||
|
<div id="testControl">
|
||
|
|
||
|
Class: <input type="text" name="dijit" id="classNode" value="dijit.form.Button"><br><br>
|
||
|
Count: <input type="text" name="count" id="countNode" value="100" size="4" ><br><br>
|
||
|
|
||
|
Method: <label for="parse">
|
||
|
<input type="radio" name="theMethod" value="parse" id="parse" checked="on"> Parse
|
||
|
</label>
|
||
|
<label for="create">
|
||
|
<input type="radio" name="theMethod" value="create" id="create"> Create
|
||
|
</label>
|
||
|
|
||
|
<br><br>
|
||
|
<span onclick="runTest()" class="runHolder"><span id="runner"> Run Test </span></span>
|
||
|
|
||
|
</div>
|
||
|
|
||
|
<br>
|
||
|
|
||
|
<div id="submitControl">
|
||
|
<p>
|
||
|
* The results of these tests are important to us. Please feel free to submit your dataSet
|
||
|
to Dojotoolkit.org. Your privacy will be respected.
|
||
|
|
||
|
</p>
|
||
|
<div id="hiddenResults">
|
||
|
<form id="resultForm" action="http://dojo.inpdx.net/benchResults.php"
|
||
|
method="POST" onsubmit="doDebug()">
|
||
|
<input type="hidden" id="hiddenHolder" value="" name="key">
|
||
|
<input type="submit" value=" Submit Data " class="submitButton">
|
||
|
</form>
|
||
|
</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
|
||
|
<div id="theContainer"><h3>Results:</h3><div id="results"></div></div>
|
||
|
|
||
|
</body>
|
||
|
</html>
|