tools/performance/pageload/cycler.html

   1 <html>
   2 <script>
   3   var pages = [
   4     "bugzilla.mozilla.org/",
   5     "lxr.mozilla.org/",
   6     "vanilla-page/"
   7   ];
   8   var pages_i18n = [];
   9
  10   var NUM_PAGES;
  11   var NUM_CYCLES;
  12
  13   function parseParams() {
  14     var s = document.location.search.substring(1);
  15     var params = s.split('&');
  16     for (var i = 0; i < params.length; ++i) {
  17       var fields = params[i].split('=');
  18       switch (fields[0]) {
  19       case 'cycles':
  20         NUM_CYCLES = (fields[1] - 0);
  21         break;
  22       case 'pages':
  23         NUM_PAGES = (fields[1] - 0);
  24         break;
  25       case 'i18n':
  26         if (fields[1] == '1') {
  27           pages = pages.concat(pages_i18n);
  28         }
  29         break;
  30       }
  31     }
  32     if (!NUM_PAGES)
  33       NUM_PAGES = pages.length;
  34     if (!NUM_CYCLES)
  35       NUM_CYCLES = 5;
  36   }
  37   parseParams();
  38
  39   var timeVals = new Array(NUM_PAGES);  // matrix of times
  40   for (var i = 0; i < timeVals.length; ++i) {
  41     timeVals[i] = new Array;
  42   }
  43   var tstart;
  44   var index = 0;
  45   var cycle = 0;
  46
  47   // returns an object with the following properties:
  48   //   min  : min value of array elements
  49   //   max  : max value of array elements
  50   //   mean : mean value of array elements
  51   //   vari : variance computation
  52   //   stdd : standard deviation, sqrt(vari)
  53   //   indexOfMax : index of max element (the element that is
  54   //                removed from the mean computation)
  55   function getArrayStats(ary) {
  56     var r = {};
  57     r.min = ary[0];
  58     r.max = ary[0];
  59     r.indexOfMax = 0;
  60     var sum = 0;
  61     for (var i = 0; i < ary.length; ++i) {
  62       if (ary[i] < r.min) {
  63         r.min = ary[i];
  64       } else if (ary[i] > r.max) {
  65         r.max = ary[i];
  66         r.indexOfMax = i;
  67       }
  68       sum = sum + ary[i];
  69     }
  70
  71     // median
  72     sorted_ary = ary.concat();
  73     sorted_ary.sort();
  74     // remove longest run
  75     sorted_ary.pop();
  76     if (sorted_ary.length%2) {
  77       r.median = sorted_ary[(sorted_ary.length-1)/2];
  78     }else{
  79       var n = Math.floor(sorted_ary.length / 2);
  80       r.median = (sorted_ary[n] + sorted_ary[n + 1]) / 2;
  81     }
  82
  83     // ignore max value when computing mean and stddev
  84     r.mean = (sum - r.max) / (ary.length - 1);
  85
  86     r.vari = 0;
  87     for (var i = 0; i < ary.length; ++i) {
  88       if (i == r.indexOfMax)
  89         continue;
  90       var d = r.mean - ary[i];
  91       r.vari = r.vari + d * d;
  92     }
  93
  94     r.vari = r.vari / (ary.length - 1);
  95     r.stdd = Math.sqrt(r.vari);
  96     return r;
  97   }
  98
  99   function appendTableCol(tr, text) {
 100     var doc = tr.ownerDocument;
 101     var td = doc.createElement("TD");
 102     td.appendChild(doc.createTextNode(text));
 103     tr.appendChild(td);
 104     return td;
 105   }
 106
 107   function dumpReport() {
 108     var all = new Array();
 109     var counter = 0;
 110
 111     for (var i = 0; i < timeVals.length; ++i) {
 112       for (var j = 0; j < timeVals[i].length; ++j) {
 113         all[counter] = timeVals[i][j];
 114         ++counter;
 115       }
 116     }
 117
 118     // avg and avg median are cumulative for all the pages
 119     var avgs = new Array();
 120     var medians = new Array();
 121     for (var i = 0; i < timeVals.length; ++i) {
 122        avgs[i] = getArrayStats(timeVals[i]).mean;
 123        medians[i] = getArrayStats(timeVals[i]).median;
 124     }
 125     var avg = getArrayStats(avgs).mean;
 126     var avgmed = getArrayStats(medians).mean;
 127
 128     var r = getArrayStats(all);
 129     dump(
 130       "(tinderbox dropping follows)\n"+
 131       "_x_x_mozilla_page_load,"+avgmed+","+r.max+","+r.min+"\n"+
 132       "_x_x_mozilla_page_load_details,avgmedian|"+avgmed+"|average|"+avg.toFixed(2)+"|minimum|"+r.min+"|maximum|"+r.max+"|stddev|"+r.stdd.toFixed(2)+":"
 133     );
 134
 135     for (var i = 0; i < timeVals.length; ++i) {
 136       r = getArrayStats(timeVals[i]);
 137       dump(
 138         '|'+
 139         i+';'+
 140         pages[i]+';'+
 141         r.median+';'+
 142         r.mean+';'+
 143         r.min+';'+
 144         r.max
 145       );
 146       for (var j = 0; j < timeVals[i].length; ++j) {
 147         dump(
 148           ';'+timeVals[i][j]
 149         );
 150       }
 151     }
 152   }
 153
 154   function showReport() {
 155     var doc = frames["content"].document;
 156     var tbody = doc.getElementById("tbody");
 157     for (var i = 0; i < timeVals.length; ++i) {
 158       var tr = doc.createElement("TR");
 159
 160       appendTableCol(tr, pages[i]);
 161
 162       var r = getArrayStats(timeVals[i]);
 163       appendTableCol(tr, r.min.toFixed(2));
 164       appendTableCol(tr, r.max.toFixed(2));
 165       appendTableCol(tr, r.mean.toFixed(2));
 166       appendTableCol(tr, r.stdd.toFixed(2));
 167       appendTableCol(tr, r.median.toFixed(2));
 168
 169       for (var j = 0; j < timeVals[i].length; ++j) {
 170         var tv = timeVals[i][j];
 171         var td = appendTableCol(tr, tv);
 172         if (j == r.indexOfMax)
 173           td.setAttribute("class", "discarded");
 174       }
 175
 176       tbody.appendChild(tr);
 177     }
 178   }
 179
 180   function loadPage(i) {
 181     tstart = new Date();
 182     frames["content"].document.location = "base/" + pages[i] + "index.html";
 183   }
 184
 185   function frameLoad() {
 186     if (cycle == NUM_CYCLES) {
 187       showReport();
 188       dumpReport();
 189       window.close();
 190       return;
 191     }
 192
 193     var tend = new Date();
 194     var href = frames["content"].document.location.href;
 195     if (href == "about:blank")
 196       return;
 197     var tdelta = tend - tstart;
 198     timeVals[index].push(tdelta);
 199     var fields = href.split('/');
 200
 201     var text = (cycle + 1) + ', ' + (index + 1) + ', ' + fields[fields.length - 2] + ", " + tdelta;
 202
 203     var doc = frames["header"].document;
 204     var body = doc.body;
 205     while (body.firstChild)
 206       body.removeChild(body.firstChild);
 207     body.appendChild(doc.createTextNode(text));
 208
 209     if (++index == NUM_PAGES) {
 210       index = 0;
 211       if (++cycle == NUM_CYCLES) {
 212         // display summary
 213         frames["content"].document.location = "report.html";
 214         return;
 215       }
 216     }
 217
 218     window.setTimeout("loadPage(" + index + ")", 500);
 219   }
 220
 221   function init() {
 222     window.resizeTo(800, 800);
 223     window.setTimeout("loadPage(" + index + ")", 500);
 224   }
 225 </script>
 226 <frameset rows="40,*" onload="init()">
 227   <frame name="header" src="header.html">
 228   <frame name="content" src="" onload="frameLoad()">
 229 </frameset>
 230 </html>