| OLD | NEW |
|---|
| (Empty) |
| 1 <html> | |
| 2 | |
| 3 <!-- | |
| 4 Copyright (c) 2012 The Chromium Authors. All rights reserved. | |
| 5 Use of this source code is governed by a BSD-style license that can be | |
| 6 found in the LICENSE file. | |
| 7 --> | |
| 8 | |
| 9 <!-- | |
| 10 A brief note on terminology as used here: a "graph" is a plotted screenful | |
| 11 of data, showing the results of one type of test: for example, the | |
| 12 page-load-time graph. A "trace" is a single line on a graph, showing one | |
| 13 one for the test: for example, the reference build trace on the | |
| 14 page-load-time graph. | |
| 15 | |
| 16 This page plots arbitrary numerical data loaded from files in a specific | |
| 17 format. It uses two or more data files, all JSON-encoded: | |
| 18 | |
| 19 graphs.dat: a list of objects, each with these properties: name (the name | |
| 20 of a graph) and units (the units for the data to be read by humans). | |
| 21 Schematically: | |
| 22 [{'name': graph_name, 'important': important, | |
| 23 'units': units}, | |
| 24 ...,] | |
| 25 | |
| 26 <graphname>-summary.dat: for each of the graphs listed in graphs.dat, the | |
| 27 corresponding summary file holds rows of data. Each row of data is an | |
| 28 object with several properties: | |
| 29 "rev": the revision number for this row of data | |
| 30 "traces": an object with several properties of its own. The name of | |
| 31 the property corresponds to a trace name, used only as an | |
| 32 internal identifier, and the property's value is an array of | |
| 33 its measurement and that measurement's standard deviation (or | |
| 34 other measurement error). | |
| 35 Schematically: | |
| 36 {"traces": {<trace_name1>: [<value1>, <stddev1>], | |
| 37 <trace_name2>: [<value2>, <stddev2>], ...}, | |
| 38 "rev": <rev>, | |
| 39 "ver": <ver>, | |
| 40 "chan": <chan>, | |
| 41 } | |
| 42 --> | |
| 43 <head> | |
| 44 | |
| 45 <style type="text/css"> | |
| 46 body { | |
| 47 font-family: sans-serif; | |
| 48 } | |
| 49 div.plot { | |
| 50 cursor: pointer; | |
| 51 } | |
| 52 div.switcher * { | |
| 53 border: 1px solid black; | |
| 54 border-radius: 4px 4px 0 0; | |
| 55 padding-left: 0.5em; | |
| 56 padding-right: 0.5em; | |
| 57 } | |
| 58 div.switcher .select { | |
| 59 background: #ddd; | |
| 60 cursor: pointer; | |
| 61 } | |
| 62 canvas.plot { | |
| 63 border: 1px solid black; | |
| 64 cursor: pointer; | |
| 65 } | |
| 66 div.plot-coordinates { | |
| 67 font-family: monospace; | |
| 68 } | |
| 69 iframe.detail { | |
| 70 display: none; | |
| 71 width: 100%; | |
| 72 height: 100%; | |
| 73 border: none; | |
| 74 } | |
| 75 div.selector { | |
| 76 border: solid 1px black; | |
| 77 cursor: pointer; | |
| 78 padding-left: 0.3em; | |
| 79 background-color: white; | |
| 80 } | |
| 81 div.selector:hover { | |
| 82 background-color: rgb(200,200,250); | |
| 83 } | |
| 84 div.selected { | |
| 85 border-left: none; | |
| 86 } | |
| 87 div.selectors { | |
| 88 width: 80px; | |
| 89 display: none; | |
| 90 } | |
| 91 #explain { | |
| 92 font-size: 0.75em; | |
| 93 font-style: italic; | |
| 94 color: rgb(100,100,100); | |
| 95 } | |
| 96 </style> | |
| 97 | |
| 98 <script src="js/common.js"></script> | |
| 99 <script src="js/plotter.js"></script> | |
| 100 <script src="js/coordinates.js"></script> | |
| 101 <script src="config.js"></script> | |
| 102 <script src="js/graph.js"></script> | |
| 103 | |
| 104 <script> | |
| 105 document.title = Config.title + ' - ' + Config.buildslave; | |
| 106 var params = ParseParams(); | |
| 107 var CHANNELS = ['canary', 'dev', 'beta', 'stable']; | |
| 108 | |
| 109 function init() { | |
| 110 Fetch('graphs.dat', onGraphListReceived); | |
| 111 } | |
| 112 | |
| 113 function onGraphListReceived(data, error) { | |
| 114 if (error) { | |
| 115 reportError(error); | |
| 116 return; | |
| 117 } | |
| 118 | |
| 119 var graphList = JsonToJs(data); | |
| 120 | |
| 121 // Add a graph for defined params. | |
| 122 if (params['channel'] != undefined && params['graph'] != undefined) { | |
| 123 var channels = params['channel'].split(','); | |
| 124 for (var i = 0; i < graphList.length; i++) { | |
| 125 if (graphList[i].name == params['graph']) { | |
| 126 graphList[i].loc = graphList[i].name + '-summary.dat'; | |
| 127 var options = { | |
| 128 width: window.innerWidth - 56, | |
| 129 showDetail: false, | |
| 130 channels: channels, | |
| 131 history: params['history'], | |
| 132 enableMouseScroll: true, | |
| 133 }; | |
| 134 var graph = new Graph('output', [graphList[i]], options); | |
| 135 graph.setTitle('<h3>' + params['channel'] + '</h3>'); | |
| 136 graph.graph(); | |
| 137 return; | |
| 138 } | |
| 139 } | |
| 140 } else { | |
| 141 // Set summary path. | |
| 142 for (var j = 0; j < graphList.length; j++) { | |
| 143 graphList[j].loc = graphList[j].name + '-summary.dat'; | |
| 144 } | |
| 145 | |
| 146 // Add channel comparison graph. | |
| 147 var options = { | |
| 148 width: window.innerWidth - 56, | |
| 149 showDetail: false, | |
| 150 channels: CHANNELS, | |
| 151 enableMouseScroll: true, | |
| 152 showTabs: true, | |
| 153 }; | |
| 154 var graph = new Graph('output', graphList, options); | |
| 155 graph.setTitle('<h3>Channel Comparison</h3>'); | |
| 156 graph.graph(); | |
| 157 | |
| 158 // Add graph for each channel. | |
| 159 for (var i = 0; i < CHANNELS.length; i++) { | |
| 160 var channel = CHANNELS[i]; | |
| 161 var options = { | |
| 162 width: window.innerWidth - 56, | |
| 163 showDetail: false, | |
| 164 channels: [channel], | |
| 165 enableMouseScroll: true, | |
| 166 showTabs: true, | |
| 167 }; | |
| 168 var graph = new Graph('output', graphList, options) | |
| 169 graph.setTitle('<h3>' + channel + '</h3>'); | |
| 170 graph.graph(); | |
| 171 } | |
| 172 } | |
| 173 } | |
| 174 | |
| 175 function reportError(error) { | |
| 176 document.getElementById('output').innerHTML = "<p>" + error + "</p>"; | |
| 177 } | |
| 178 | |
| 179 window.addEventListener('load', init, false); | |
| 180 | |
| 181 </script> | |
| 182 </head> | |
| 183 | |
| 184 <body> | |
| 185 <div id="header_text"> | |
| 186 Builds generated by the <a href="#">Chrome Buildbot</a> | |
| 187 are run through <b> | |
| 188 <script> | |
| 189 document.write(Config.title); | |
| 190 </script> | |
| 191 </b>and the results of that test are charted here. | |
| 192 </div> | |
| 193 <div id="explain"> | |
| 194 The vertical axis is measured values, and the horizontal | |
| 195 axis is the version number for the build being tested. | |
| 196 Shift-click to place baseline. Shift-scroll to zoom slowly. | |
| 197 </div> | |
| 198 <p></p> | |
| 199 <div id="output"></div> | |
| 200 <pre id="log"></pre> | |
| 201 </body> | |
| 202 </html> | |
| OLD | NEW |
|---|
Chromium Code Reviews
Issue 1654813003:
Remove old dead perf dashboard pages and js (Closed)
Base URL: svn://svn.chromium.org/chrome/trunk/tools/