Update benchmark test suite
[WebKit-https.git] / PerformanceTests / Animometer / developer.html
1 <!DOCTYPE html>
2 <html>
3 <head>
4     <meta name="viewport" content="width=device-width, user-scalable=no">
5     <link rel="stylesheet" href="resources/runner/animometer.css">
6     <link rel="stylesheet" href="resources/debug-runner/animometer.css">
7     <script src="resources/strings.js"></script>
8     <script src="resources/extensions.js" charset="utf-8"></script>
9
10     <script src="resources/runner/tests.js" charset="utf-8"></script>
11     <script src="resources/debug-runner/tests.js" charset="utf-8"></script>
12     <script src="resources/runner/animometer.js"></script>
13     <script src="resources/debug-runner/animometer.js"></script>
14
15     <script src="resources/runner/benchmark-runner.js"></script>
16     <script src="resources/debug-runner/d3.min.js"></script>
17     <script src="resources/debug-runner/graph.js"></script>
18 </head>
19 <body>
20     <main>
21         <hr>
22         <section id="intro" class="selected">
23             <h1>Animometer</h1>
24             <div>
25                 <div id="suites">
26                     <h2>Suites:</h2>
27                     <ul class="tree"></ul>
28                 </div>
29                 <div id="options">
30                     <h2>Options:</h2>
31                     <form name="benchmark-options">
32                     <ul>
33                     <li>
34                         <label>Test length: <input type="number" id="test-interval" value="10"> seconds each</label>
35                     </li>
36                     <li>
37                         <h3>Display:</h3>
38                         <ul>
39                             <li><label><input name="display" type="radio" value="minimal" checked> Minimal</label></li>
40                             <li><label><input name="display" type="radio" value="progress-bar" checked> Progress bar</label></li>
41                         </ul>
42                     </li>
43                     <li>
44                         <h3>Adjusting the test complexity:</h3>
45                         <ul>
46                             <li><label><input name="adjustment" type="radio" value="fixed"> Keep constant</label></li>
47                             <li><label><input name="adjustment" type="radio" value="fixed-after-warmup"> Keep constant after warmup to target FPS</label></li>
48                             <li><label><input name="adjustment" type="radio" value="adaptive" checked> Maintain target FPS</label></li>
49                         </ul>
50                     </li>
51                     <li>
52                         <label>Target frame rate: <input type="number" id="frame-rate" value="50"> FPS</label>
53                     </li>
54                     <li>
55                         <label><input type="checkbox" id="estimated-frame-rate" checked> Filter frame rate calculation</label>
56                     </li>
57                     </ul>
58                     </form>
59                 </div>
60             </div>
61             <button onclick="benchmarkController.startBenchmark()">Start Test</button>
62         </section>
63         <section id="test-container">
64             <div id="running-test" class="frame-container"></div>
65             <div id="progress">
66                 <div id="progress-completed"></div>
67             </div>
68         </section>
69         <section id="results">
70             <h1>Animometer score</h1>
71             <p class="score"></p>
72             <div id="results-tables">
73                 <div>
74                     <table id="results-score"></table>
75                     <table id="results-data"></table>
76                 </div>
77                 <table id="results-header"></table>
78             </div>
79             <div id="results-json">
80                 <button class="small-button" onclick="benchmarkController.showJSONResults()">JSON results</button>
81                 <div class="hidden">
82                     JSON:
83                     <textarea rows=1 onclick="this.focus();this.select()" readonly></textarea>
84                 </div>
85             </div>
86             <button onclick="benchmarkController.startBenchmark()">Test Again</button>
87             <p>'s': Select different data for copy/paste</p>
88         </section>
89         <section id="test-graph">
90             <header>
91                 <button onclick="benchmarkController.showResults()">&lt; Results</button>
92                 <h1>Graph:</h1>
93             </header>
94             <nav>
95                 <form name="graph-options">
96                     <ul>
97                         <li><label><input type="checkbox" name="markers" checked> Markers</label>
98                             <span>time: <span class="time"></span></span></li>
99                         <li><label><input type="checkbox" name="averages" checked> Averages</label></li>
100                         <li><label><input type="checkbox" name="complexity" checked> Complexity</label>
101                             <span class="complexity"></span></li>
102                         <li><label><input type="checkbox" name="rawFPS"> Raw FPS</label>
103                             <span class="rawFPS"></span></li>
104                         <li><label><input type="checkbox" name="filteredFPS" checked> Filtered FPS</label>
105                             <span class="filteredFPS"></span></li>
106                         <li><label><input type="checkbox" name="intervalFPS"> Average FPS per sample interval</label>
107                             <span class="intervalFPS"></span></li>
108                     </ul>
109                 </form>
110             </nav>
111             <p class="score"></p>
112             <p class="mean"></p>
113             <div id="test-graph-data"></div>
114         </section>
115         <hr>
116     </main>
117 </body>
118 </html>