<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head><meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>[196297] trunk/PerformanceTests</title>
</head>
<body>
<style type="text/css"><!--
#msg dl.meta { border: 1px #006 solid; background: #369; padding: 6px; color: #fff; }
#msg dl.meta dt { float: left; width: 6em; font-weight: bold; }
#msg dt:after { content:':';}
#msg dl, #msg dt, #msg ul, #msg li, #header, #footer, #logmsg { font-family: verdana,arial,helvetica,sans-serif; font-size: 10pt; }
#msg dl a { font-weight: bold}
#msg dl a:link { color:#fc3; }
#msg dl a:active { color:#ff0; }
#msg dl a:visited { color:#cc6; }
h3 { font-family: verdana,arial,helvetica,sans-serif; font-size: 10pt; font-weight: bold; }
#msg pre { overflow: auto; background: #ffc; border: 1px #fa0 solid; padding: 6px; }
#logmsg { background: #ffc; border: 1px #fa0 solid; padding: 1em 1em 0 1em; }
#logmsg p, #logmsg pre, #logmsg blockquote { margin: 0 0 1em 0; }
#logmsg p, #logmsg li, #logmsg dt, #logmsg dd { line-height: 14pt; }
#logmsg h1, #logmsg h2, #logmsg h3, #logmsg h4, #logmsg h5, #logmsg h6 { margin: .5em 0; }
#logmsg h1:first-child, #logmsg h2:first-child, #logmsg h3:first-child, #logmsg h4:first-child, #logmsg h5:first-child, #logmsg h6:first-child { margin-top: 0; }
#logmsg ul, #logmsg ol { padding: 0; list-style-position: inside; margin: 0 0 0 1em; }
#logmsg ul { text-indent: -1em; padding-left: 1em; }#logmsg ol { text-indent: -1.5em; padding-left: 1.5em; }
#logmsg > ul, #logmsg > ol { margin: 0 0 1em 0; }
#logmsg pre { background: #eee; padding: 1em; }
#logmsg blockquote { border: 1px solid #fa0; border-left-width: 10px; padding: 1em 1em 0 1em; background: white;}
#logmsg dl { margin: 0; }
#logmsg dt { font-weight: bold; }
#logmsg dd { margin: 0; padding: 0 0 0.5em 0; }
#logmsg dd:before { content:'\00bb';}
#logmsg table { border-spacing: 0px; border-collapse: collapse; border-top: 4px solid #fa0; border-bottom: 1px solid #fa0; background: #fff; }
#logmsg table th { text-align: left; font-weight: normal; padding: 0.2em 0.5em; border-top: 1px dotted #fa0; }
#logmsg table td { text-align: right; border-top: 1px dotted #fa0; padding: 0.2em 0.5em; }
#logmsg table thead th { text-align: center; border-bottom: 1px solid #fa0; }
#logmsg table th.Corner { text-align: left; }
#logmsg hr { border: none 0; border-top: 2px dashed #fa0; height: 1px; }
#header, #footer { color: #fff; background: #636; border: 1px #300 solid; padding: 6px; }
#patch { width: 100%; }
#patch h4 {font-family: verdana,arial,helvetica,sans-serif;font-size:10pt;padding:8px;background:#369;color:#fff;margin:0;}
#patch .propset h4, #patch .binary h4 {margin:0;}
#patch pre {padding:0;line-height:1.2em;margin:0;}
#patch .diff {width:100%;background:#eee;padding: 0 0 10px 0;overflow:auto;}
#patch .propset .diff, #patch .binary .diff {padding:10px 0;}
#patch span {display:block;padding:0 10px;}
#patch .modfile, #patch .addfile, #patch .delfile, #patch .propset, #patch .binary, #patch .copfile {border:1px solid #ccc;margin:10px 0;}
#patch ins {background:#dfd;text-decoration:none;display:block;padding:0 10px;}
#patch del {background:#fdd;text-decoration:none;display:block;padding:0 10px;}
#patch .lines, .info {color:#888;background:#fff;}
--></style>
<div id="msg">
<dl class="meta">
<dt>Revision</dt> <dd><a href="http://trac.webkit.org/projects/webkit/changeset/196297">196297</a></dd>
<dt>Author</dt> <dd>jonlee@apple.com</dd>
<dt>Date</dt> <dd>2016-02-08 19:30:47 -0800 (Mon, 08 Feb 2016)</dd>
</dl>
<h3>Log Message</h3>
<pre>Move ResultsTable functionality not needed for release tests out.
Move reporting of score and mean to selection of the time-based graph.
* Animometer/developer.html: Rename graph-options to time-graph-options.
* Animometer/resources/debug-runner/animometer.js:
(DeveloperResultsTable): Moved from runner/animometer.js. Switch from mean
values to "average" objects which can hold stdev. Move graph button and
calculation of noisy measurements here. Sophisticated header processing
is not needed in release suite.
(populateTable): Use DeveloperResultsTable.
* Animometer/resources/debug-runner/graph.js: Pull time graph creation to
its own function, and add a new onGraphTypeChanged handler in preparation
of a complexity graph to be added later.
* Animometer/resources/runner/animometer.js:
(ResultsTable): Simplify to just handle test names and scores.</pre>
<h3>Modified Paths</h3>
<ul>
<li><a href="#trunkPerformanceTestsAnimometerdeveloperhtml">trunk/PerformanceTests/Animometer/developer.html</a></li>
<li><a href="#trunkPerformanceTestsAnimometerresourcesdebugrunneranimometerjs">trunk/PerformanceTests/Animometer/resources/debug-runner/animometer.js</a></li>
<li><a href="#trunkPerformanceTestsAnimometerresourcesdebugrunnergraphjs">trunk/PerformanceTests/Animometer/resources/debug-runner/graph.js</a></li>
<li><a href="#trunkPerformanceTestsAnimometerresourcesrunneranimometerjs">trunk/PerformanceTests/Animometer/resources/runner/animometer.js</a></li>
<li><a href="#trunkPerformanceTestsChangeLog">trunk/PerformanceTests/ChangeLog</a></li>
</ul>
</div>
<div id="patch">
<h3>Diff</h3>
<a id="trunkPerformanceTestsAnimometerdeveloperhtml"></a>
<div class="modfile"><h4>Modified: trunk/PerformanceTests/Animometer/developer.html (196296 => 196297)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/PerformanceTests/Animometer/developer.html 2016-02-09 03:30:44 UTC (rev 196296)
+++ trunk/PerformanceTests/Animometer/developer.html 2016-02-09 03:30:47 UTC (rev 196297)
</span><span class="lines">@@ -8,14 +8,14 @@
</span><span class="cx"> <script src="resources/strings.js"></script>
</span><span class="cx"> <script src="resources/extensions.js"></script>
</span><span class="cx">
</span><del>- <script src="resources/runner/tests.js" charset="utf-8"></script>
</del><ins>+ <script src="resources/runner/tests.js"></script>
</ins><span class="cx"> <script src="resources/debug-runner/tests.js" charset="utf-8"></script>
</span><del>- <script src="resources/runner/animometer.js" charset="utf-8"></script>
</del><ins>+ <script src="resources/runner/animometer.js"></script>
</ins><span class="cx"> <script src="resources/debug-runner/animometer.js"></script>
</span><span class="cx">
</span><span class="cx"> <script src="resources/runner/benchmark-runner.js"></script>
</span><span class="cx"> <script src="resources/debug-runner/d3.min.js"></script>
</span><del>- <script src="resources/debug-runner/graph.js"></script>
</del><ins>+ <script src="resources/debug-runner/graph.js" charset="utf-8"></script>
</ins><span class="cx"> </head>
</span><span class="cx"> <body>
</span><span class="cx"> <main>
</span><span class="lines">@@ -103,7 +103,7 @@
</span><span class="cx"> <h1>Graph:</h1>
</span><span class="cx"> </header>
</span><span class="cx"> <nav>
</span><del>- <form name="graph-options">
</del><ins>+ <form name="time-graph-options">
</ins><span class="cx"> <ul>
</span><span class="cx"> <li><label><input type="checkbox" name="markers" checked> Markers</label>
</span><span class="cx"> <span>time: <span class="time"></span></span></li>
</span></span></pre></div>
<a id="trunkPerformanceTestsAnimometerresourcesdebugrunneranimometerjs"></a>
<div class="modfile"><h4>Modified: trunk/PerformanceTests/Animometer/resources/debug-runner/animometer.js (196296 => 196297)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/PerformanceTests/Animometer/resources/debug-runner/animometer.js 2016-02-09 03:30:44 UTC (rev 196296)
+++ trunk/PerformanceTests/Animometer/resources/debug-runner/animometer.js 2016-02-09 03:30:47 UTC (rev 196297)
</span><span class="lines">@@ -19,6 +19,111 @@
</span><span class="cx"> }
</span><span class="cx"> });
</span><span class="cx">
</span><ins>+DeveloperResultsTable = Utilities.createSubclass(ResultsTable,
+ function(element, headers)
+ {
+ ResultsTable.call(this, element, headers);
+ }, {
+
+ _addGraphButton: function(td, testName, testResults)
+ {
+ var data = testResults[Strings.json.samples];
+ if (!data)
+ return;
+
+ var button = Utilities.createElement("button", { class: "small-button" }, td);
+
+ button.addEventListener("click", function() {
+ var graphData = {
+ axes: [Strings.text.complexity, Strings.text.frameRate],
+ samples: data,
+ complexityAverageSamples: testResults[Strings.json.complexityAverageSamples],
+ averages: {},
+ marks: testResults[Strings.json.marks]
+ };
+ [Strings.json.experiments.complexity, Strings.json.experiments.frameRate].forEach(function(experiment) {
+ if (experiment in testResults)
+ graphData.averages[experiment] = testResults[experiment];
+ });
+
+ [
+ Strings.json.score,
+ Strings.json.regressions.timeRegressions,
+ Strings.json.regressions.complexityRegression,
+ Strings.json.regressions.complexityAverageRegression,
+ Strings.json.targetFrameLength
+ ].forEach(function(key) {
+ if (testResults[key])
+ graphData[key] = testResults[key];
+ });
+
+ benchmarkController.showTestGraph(testName, graphData);
+ });
+
+ button.textContent = Strings.text.graph + "...";
+ },
+
+ _isNoisyMeasurement: function(jsonExperiment, data, measurement, options)
+ {
+ const percentThreshold = 10;
+ const averageThreshold = 2;
+
+ if (measurement == Strings.json.measurements.percent)
+ return data[Strings.json.measurements.percent] >= percentThreshold;
+
+ if (jsonExperiment == Strings.json.experiments.frameRate && measurement == Strings.json.measurements.average)
+ return Math.abs(data[Strings.json.measurements.average] - options["frame-rate"]) >= averageThreshold;
+
+ return false;
+ },
+
+ _addTest: function(testName, testResults, options)
+ {
+ var row = Utilities.createElement("tr", {}, this.element);
+
+ var isNoisy = false;
+ [Strings.json.experiments.complexity, Strings.json.experiments.frameRate].forEach(function (experiment) {
+ var data = testResults[experiment];
+ for (var measurement in data) {
+ if (this._isNoisyMeasurement(experiment, data, measurement, options))
+ isNoisy = true;
+ }
+ }, this);
+
+ this._flattenedHeaders.forEach(function (header) {
+ var className = "";
+ if (header.className) {
+ if (typeof header.className == "function")
+ className = header.className(testResults, options);
+ else
+ className = header.className;
+ }
+
+ if (header.title == Strings.text.testName) {
+ if (isNoisy)
+ className += " noisy-results";
+ var td = Utilities.createElement("td", { class: className }, row);
+ td.textContent = testName;
+ return;
+ }
+
+ var td = Utilities.createElement("td", { class: className }, row);
+ if (header.title == Strings.text.graph) {
+ this._addGraphButton(td, testName, testResults);
+ } else if (!("text" in header)) {
+ td.textContent = testResults[header.title];
+ } else if (typeof header.text == "string") {
+ var data = testResults[header.text];
+ if (typeof data == "number")
+ data = data.toFixed(2);
+ td.textContent = data;
+ } else {
+ td.textContent = header.text(testResults, testName);
+ }
+ }, this);
+ }
+});
+
</ins><span class="cx"> Utilities.extendObject(window.benchmarkRunnerClient, {
</span><span class="cx"> testsCount: null,
</span><span class="cx"> progressBar: null,
</span><span class="lines">@@ -45,6 +150,12 @@
</span><span class="cx"> setSectionHeader: function(sectionIdentifier, title)
</span><span class="cx"> {
</span><span class="cx"> document.querySelector("#" + sectionIdentifier + " h1").textContent = title;
</span><ins>+ },
+
+ populateTable: function(tableIdentifier, headers, data)
+ {
+ var table = new DeveloperResultsTable(document.getElementById(tableIdentifier), headers);
+ table.showIterations(data, benchmarkRunnerClient.options);
</ins><span class="cx"> }
</span><span class="cx"> });
</span><span class="cx">
</span><span class="lines">@@ -343,7 +454,7 @@
</span><span class="cx"> initialize: function()
</span><span class="cx"> {
</span><span class="cx"> document.forms["benchmark-options"].addEventListener("change", benchmarkController.onBenchmarkOptionsChanged, true);
</span><del>- document.forms["graph-options"].addEventListener("change", benchmarkController.onGraphOptionsChanged, true);
</del><ins>+ document.forms["time-graph-options"].addEventListener("change", benchmarkController.onTimeGraphOptionsChanged, true);
</ins><span class="cx"> optionsManager.updateUIFromLocalStorage();
</span><span class="cx"> suitesManager.createElements();
</span><span class="cx"> suitesManager.updateUIFromLocalStorage();
</span><span class="lines">@@ -397,10 +508,9 @@
</span><span class="cx"> document.querySelector("#results-json div").classList.remove("hidden");
</span><span class="cx"> },
</span><span class="cx">
</span><del>- showTestGraph: function(testName, score, mean, graphData)
</del><ins>+ showTestGraph: function(testName, graphData)
</ins><span class="cx"> {
</span><span class="cx"> sectionsManager.setSectionHeader("test-graph", testName);
</span><del>- sectionsManager.setSectionScore("test-graph", score, mean);
</del><span class="cx"> sectionsManager.showSection("test-graph", true);
</span><span class="cx"> this.updateGraphData(graphData);
</span><span class="cx"> }
</span></span></pre></div>
<a id="trunkPerformanceTestsAnimometerresourcesdebugrunnergraphjs"></a>
<div class="modfile"><h4>Modified: trunk/PerformanceTests/Animometer/resources/debug-runner/graph.js (196296 => 196297)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/PerformanceTests/Animometer/resources/debug-runner/graph.js 2016-02-09 03:30:44 UTC (rev 196296)
+++ trunk/PerformanceTests/Animometer/resources/debug-runner/graph.js 2016-02-09 03:30:47 UTC (rev 196297)
</span><span class="lines">@@ -5,12 +5,22 @@
</span><span class="cx"> {
</span><span class="cx"> var element = document.getElementById("test-graph-data");
</span><span class="cx"> element.innerHTML = "";
</span><ins>+ element.graphData = graphData;
</ins><span class="cx"> document.querySelector("hr").style.width = this.layoutCounter++ + "px";
</span><span class="cx">
</span><span class="cx"> var margins = new Insets(30, 30, 30, 40);
</span><span class="cx"> var size = Point.elementClientSize(element).subtract(margins.size);
</span><span class="cx">
</span><ins>+ this.createTimeGraph(graphData, margins, size);
+ this.onTimeGraphOptionsChanged();
+
+ this.onGraphTypeChanged();
+ },
+
+ createTimeGraph: function(graphData, margins, size)
+ {
</ins><span class="cx"> var svg = d3.select("#test-graph-data").append("svg")
</span><ins>+ .attr("id", "time-graph")
</ins><span class="cx"> .attr("width", size.width + margins.left + margins.right)
</span><span class="cx"> .attr("height", size.height + margins.top + margins.bottom)
</span><span class="cx"> .append("g")
</span><span class="lines">@@ -22,10 +32,14 @@
</span><span class="cx"> // Axis scales
</span><span class="cx"> var x = d3.scale.linear()
</span><span class="cx"> .range([0, size.width])
</span><del>- .domain([0, d3.max(graphData.samples, function(s) { return s.time; })]);
</del><ins>+ .domain([
+ Math.min(d3.min(graphData.samples, function(s) { return s.time; }), 0),
+ d3.max(graphData.samples, function(s) { return s.time; })]);
+ var complexityMax = d3.max(graphData.samples, function(s) { return s.complexity; });
+
</ins><span class="cx"> var yLeft = d3.scale.linear()
</span><span class="cx"> .range([size.height, 0])
</span><del>- .domain([0, d3.max(graphData.samples, function(s) { return s.complexity; })]);
</del><ins>+ .domain([0, complexityMax]);
</ins><span class="cx"> var yRight = d3.scale.linear()
</span><span class="cx"> .range([size.height, 0])
</span><span class="cx"> .domain([1000/20, 1000/60]);
</span><span class="lines">@@ -98,32 +112,33 @@
</span><span class="cx"> .attr("class", "marker")
</span><span class="cx"> .attr("transform", "translate(" + xLocation + ", 0)");
</span><span class="cx"> markerGroup.append("text")
</span><del>- .attr("transform", "translate(10, " + (yMin - 10) + ") rotate(-90)")
- .style("text-anchor", "start")
- .text(markName)
</del><ins>+ .attr("transform", "translate(10, " + (yMin - 10) + ") rotate(-90)")
+ .style("text-anchor", "start")
+ .text(markName)
</ins><span class="cx"> markerGroup.append("line")
</span><del>- .attr("x1", 0)
- .attr("x2", 0)
- .attr("y1", yMin)
- .attr("y2", yMax);
</del><ins>+ .attr("x1", 0)
+ .attr("x2", 0)
+ .attr("y1", yMin)
+ .attr("y2", yMax);
</ins><span class="cx"> }
</span><span class="cx">
</span><del>- // left-mean
- svg.append("line")
- .attr("x1", x(0))
- .attr("x2", size.width)
- .attr("y1", yLeft(graphData.mean[0]))
- .attr("y2", yLeft(graphData.mean[0]))
- .attr("class", "left-mean mean");
</del><ins>+ if (Strings.json.experiments.complexity in graphData.averages) {
+ var complexity = graphData.averages[Strings.json.experiments.complexity];
+ var regression = svg.append("g")
+ .attr("class", "complexity mean");
+ this._addRegressionLine(regression, x, yLeft, [[graphData.samples[0].time, complexity.average], [graphData.samples[graphData.samples.length - 1].time, complexity.average]], complexity.stdev);
+ }
+ if (Strings.json.experiments.frameRate in graphData.averages) {
+ var frameRate = graphData.averages[Strings.json.experiments.frameRate];
+ var average = yRight(1000/frameRate.average);
+ svg.append("line")
+ .attr("x1", x(0))
+ .attr("x2", size.width)
+ .attr("y1", average)
+ .attr("y2", average)
+ .attr("class", "fps mean");
+ }
</ins><span class="cx">
</span><del>- // right-mean
- svg.append("line")
- .attr("x1", x(0))
- .attr("x2", size.width)
- .attr("y1", yRight(graphData.mean[1]))
- .attr("y2", yRight(graphData.mean[1]))
- .attr("class", "right-mean mean");
-
</del><span class="cx"> // right-target
</span><span class="cx"> if (targetFrameLength) {
</span><span class="cx"> svg.append("line")
</span><span class="lines">@@ -135,7 +150,7 @@
</span><span class="cx"> }
</span><span class="cx">
</span><span class="cx"> // Cursor
</span><del>- var cursorGroup = svg.append("g").attr("id", "cursor");
</del><ins>+ var cursorGroup = svg.append("g").attr("class", "cursor");
</ins><span class="cx"> cursorGroup.append("line")
</span><span class="cx"> .attr("x1", 0)
</span><span class="cx"> .attr("x2", 0)
</span><span class="lines">@@ -179,19 +194,19 @@
</span><span class="cx"> .attr("fill", "transparent")
</span><span class="cx"> .attr("x", 0)
</span><span class="cx"> .attr("y", 0)
</span><del>- .attr("width", size.x)
- .attr("height", size.y);
</del><ins>+ .attr("width", size.width)
+ .attr("height", size.height);
</ins><span class="cx">
</span><span class="cx"> var timeBisect = d3.bisector(function(d) { return d.time; }).right;
</span><span class="cx"> var statsToHighlight = ["complexity", "rawFPS", "filteredFPS"];
</span><span class="cx"> area.on("mouseover", function() {
</span><del>- document.getElementById("cursor").classList.remove("hidden");
</del><ins>+ document.querySelector("#time-graph .cursor").classList.remove("hidden");
</ins><span class="cx"> document.querySelector("#test-graph nav").classList.remove("hide-data");
</span><span class="cx"> }).on("mouseout", function() {
</span><del>- document.getElementById("cursor").classList.add("hidden");
</del><ins>+ document.querySelector("#time-graph .cursor").classList.add("hidden");
</ins><span class="cx"> document.querySelector("#test-graph nav").classList.add("hide-data");
</span><span class="cx"> }).on("mousemove", function() {
</span><del>- var form = document.forms["graph-options"].elements;
</del><ins>+ var form = document.forms["time-graph-options"].elements;
</ins><span class="cx">
</span><span class="cx"> var mx_domain = x.invert(d3.mouse(this)[0]);
</span><span class="cx"> var index = Math.min(timeBisect(allData, mx_domain), allData.length - 1);
</span><span class="lines">@@ -229,9 +244,9 @@
</span><span class="cx"> cursorGroup.select("." + name)
</span><span class="cx"> .attr("cx", cursor_x)
</span><span class="cx"> .attr("cy", data_y);
</span><del>- document.querySelector("#cursor ." + name).classList.remove("hidden");
</del><ins>+ document.querySelector("#time-graph .cursor ." + name).classList.remove("hidden");
</ins><span class="cx"> } else
</span><del>- document.querySelector("#cursor ." + name).classList.add("hidden");
</del><ins>+ document.querySelector("#time-graph .cursor ." + name).classList.add("hidden");
</ins><span class="cx"> });
</span><span class="cx">
</span><span class="cx"> if (form["rawFPS"].checked)
</span><span class="lines">@@ -243,27 +258,58 @@
</span><span class="cx"> .attr("y2", Math.max.apply(null, ys));
</span><span class="cx">
</span><span class="cx"> });
</span><del>- this.onGraphOptionsChanged();
</del><span class="cx"> },
</span><span class="cx">
</span><del>- onGraphOptionsChanged: function() {
- var form = document.forms["graph-options"].elements;
</del><ins>+ _showOrHideNodes: function(isShown, selector) {
+ var nodeList = document.querySelectorAll(selector);
+ if (isShown) {
+ for (var i = 0; i < nodeList.length; ++i)
+ nodeList[i].classList.remove("hidden");
+ } else {
+ for (var i = 0; i < nodeList.length; ++i)
+ nodeList[i].classList.add("hidden");
+ }
+ },
</ins><span class="cx">
</span><del>- function showOrHideNodes(isShown, selector) {
- var nodeList = document.querySelectorAll(selector);
- if (isShown) {
- for (var i = 0; i < nodeList.length; ++i)
- nodeList[i].classList.remove("hidden");
- } else {
- for (var i = 0; i < nodeList.length; ++i)
- nodeList[i].classList.add("hidden");
</del><ins>+ onTimeGraphOptionsChanged: function() {
+ var form = document.forms["time-graph-options"].elements;
+ benchmarkController._showOrHideNodes(form["markers"].checked, ".marker");
+ benchmarkController._showOrHideNodes(form["averages"].checked, "#test-graph-data .mean");
+ benchmarkController._showOrHideNodes(form["complexity"].checked, "#complexity");
+ benchmarkController._showOrHideNodes(form["rawFPS"].checked, "#rawFPS");
+ benchmarkController._showOrHideNodes(form["filteredFPS"].checked, "#filteredFPS");
+ benchmarkController._showOrHideNodes(form["regressions"].checked, "#regressions");
+ },
+
+ onGraphTypeChanged: function() {
+ var form = document.forms["graph-type"].elements;
+ var graphData = document.getElementById("test-graph-data").graphData;
+ var isTimeSelected = true;
+
+ benchmarkController._showOrHideNodes(isTimeSelected, "#time-graph");
+ benchmarkController._showOrHideNodes(isTimeSelected, "form[name=time-graph-options]");
+
+ var score, mean;
+ if (isTimeSelected) {
+ score = graphData.score.toFixed(2);
+
+ var regression = graphData.averages.complexity;
+ mean = [
+ "mean: ",
+ regression.average.toFixed(2),
+ " ± ",
+ regression.stdev.toFixed(2),
+ " (",
+ regression.percent.toFixed(2),
+ "%)"];
+ if (regression.concern) {
+ mean = mean.concat([
+ ", worst 5%: ",
+ regression.concern.toFixed(2)]);
</ins><span class="cx"> }
</span><ins>+ mean = mean.join("");
</ins><span class="cx"> }
</span><span class="cx">
</span><del>- showOrHideNodes(form["markers"].checked, ".marker");
- showOrHideNodes(form["averages"].checked, ".mean");
- showOrHideNodes(form["complexity"].checked, "#complexity");
- showOrHideNodes(form["rawFPS"].checked, "#rawFPS");
- showOrHideNodes(form["filteredFPS"].checked, "#filteredFPS");
</del><ins>+ sectionsManager.setSectionScore("test-graph", score, mean);
</ins><span class="cx"> }
</span><span class="cx"> });
</span></span></pre></div>
<a id="trunkPerformanceTestsAnimometerresourcesrunneranimometerjs"></a>
<div class="modfile"><h4>Modified: trunk/PerformanceTests/Animometer/resources/runner/animometer.js (196296 => 196297)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/PerformanceTests/Animometer/resources/runner/animometer.js 2016-02-09 03:30:44 UTC (rev 196296)
+++ trunk/PerformanceTests/Animometer/resources/runner/animometer.js 2016-02-09 03:30:47 UTC (rev 196297)
</span><span class="lines">@@ -98,58 +98,6 @@
</span><span class="cx"> });
</span><span class="cx"> },
</span><span class="cx">
</span><del>- _addGraphButton: function(td, testName, testResults)
- {
- var data = testResults[Strings.json.samples];
- if (!data)
- return;
-
- var button = Utilities.createElement("button", { class: "small-button" }, td);
-
- button.addEventListener("click", function() {
- var score = testResults[Strings.json.score].toFixed(2);
- var complexity = testResults[Strings.json.experiments.complexity];
- var mean = [
- "mean: ",
- complexity[Strings.json.measurements.average].toFixed(2),
- " ± ",
- complexity[Strings.json.measurements.stdev].toFixed(2),
- " (",
- complexity[Strings.json.measurements.percent].toFixed(2),
- "%), worst 5%: ",
- complexity[Strings.json.measurements.concern].toFixed(2)].join("");
-
- var graphData = {
- axes: [Strings.text.experiments.complexity, Strings.text.experiments.frameRate],
- mean: [
- testResults[Strings.json.experiments.complexity][Strings.json.measurements.average],
- 1000 / testResults[Strings.json.experiments.frameRate][Strings.json.measurements.average]
- ],
- samples: data,
- marks: testResults[Strings.json.marks]
- }
- if (testResults[Strings.json.targetFrameLength])
- graphData.targetFrameLength = testResults[Strings.json.targetFrameLength];
- benchmarkController.showTestGraph(testName, score, mean, graphData);
- });
-
- button.textContent = Strings.text.results.graph + "...";
- },
-
- _isNoisyMeasurement: function(jsonExperiment, data, measurement, options)
- {
- const percentThreshold = 10;
- const averageThreshold = 2;
-
- if (measurement == Strings.json.measurements.percent)
- return data[Strings.json.measurements.percent] >= percentThreshold;
-
- if (jsonExperiment == Strings.json.experiments.frameRate && measurement == Strings.json.measurements.average)
- return Math.abs(data[Strings.json.measurements.average] - options["frame-rate"]) >= averageThreshold;
-
- return false;
- },
-
</del><span class="cx"> _addEmptyRow: function()
</span><span class="cx"> {
</span><span class="cx"> var row = Utilities.createElement("tr", {}, this.element);
</span><span class="lines">@@ -162,45 +110,15 @@
</span><span class="cx"> {
</span><span class="cx"> var row = Utilities.createElement("tr", {}, this.element);
</span><span class="cx">
</span><del>- var isNoisy = false;
- [Strings.json.experiments.complexity, Strings.json.experiments.frameRate].forEach(function (experiment) {
- var data = testResults[experiment];
- for (var measurement in data) {
- if (this._isNoisyMeasurement(experiment, data, measurement, options))
- isNoisy = true;
- }
- }, this);
-
</del><span class="cx"> this._flattenedHeaders.forEach(function (header) {
</span><del>- var className = "";
- if (header.className) {
- if (typeof header.className == "function")
- className = header.className(testResults, options);
- else
- className = header.className;
- }
-
</del><ins>+ var td = Utilities.createElement("td", {}, row);
</ins><span class="cx"> if (header.title == Strings.text.testName) {
</span><del>- var titleClassName = className;
- if (isNoisy)
- titleClassName += " noisy-results";
- var td = Utilities.createElement("td", { class: titleClassName }, row);
</del><span class="cx"> td.textContent = testName;
</span><del>- return;
- }
-
- var td = Utilities.createElement("td", { class: className }, row);
- if (header.title == Strings.text.results.graph) {
- this._addGraphButton(td, testName, testResults);
- } else if (!("text" in header)) {
- td.textContent = testResults[header.title];
- } else if (typeof header.text == "string") {
</del><ins>+ } else if (header.text) {
</ins><span class="cx"> var data = testResults[header.text];
</span><span class="cx"> if (typeof data == "number")
</span><span class="cx"> data = data.toFixed(2);
</span><span class="cx"> td.textContent = data;
</span><del>- } else {
- td.textContent = header.text(testResults, testName);
</del><span class="cx"> }
</span><span class="cx"> }, this);
</span><span class="cx"> },
</span></span></pre></div>
<a id="trunkPerformanceTestsChangeLog"></a>
<div class="modfile"><h4>Modified: trunk/PerformanceTests/ChangeLog (196296 => 196297)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/PerformanceTests/ChangeLog 2016-02-09 03:30:44 UTC (rev 196296)
+++ trunk/PerformanceTests/ChangeLog 2016-02-09 03:30:47 UTC (rev 196297)
</span><span class="lines">@@ -1,5 +1,23 @@
</span><span class="cx"> 2016-02-07 Jon Lee <jonlee@apple.com>
</span><span class="cx">
</span><ins>+ Move ResultsTable functionality not needed for release tests out.
+ Move reporting of score and mean to selection of the time-based graph.
+
+ * Animometer/developer.html: Rename graph-options to time-graph-options.
+ * Animometer/resources/debug-runner/animometer.js:
+ (DeveloperResultsTable): Moved from runner/animometer.js. Switch from mean
+ values to "average" objects which can hold stdev. Move graph button and
+ calculation of noisy measurements here. Sophisticated header processing
+ is not needed in release suite.
+ (populateTable): Use DeveloperResultsTable.
+ * Animometer/resources/debug-runner/graph.js: Pull time graph creation to
+ its own function, and add a new onGraphTypeChanged handler in preparation
+ of a complexity graph to be added later.
+ * Animometer/resources/runner/animometer.js:
+ (ResultsTable): Simplify to just handle test names and scores.
+
+2016-02-07 Jon Lee <jonlee@apple.com>
+
</ins><span class="cx"> Tests: reuse objects already made.
</span><span class="cx">
</span><span class="cx"> Avoid thrash of object creation and removal by maintaining an index that
</span></span></pre>
</div>
</div>
</body>
</html>