<!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>[202315] 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/202315">202315</a></dd>
<dt>Author</dt> <dd>jonlee@apple.com</dd>
<dt>Date</dt> <dd>2016-06-21 20:12:26 -0700 (Tue, 21 Jun 2016)</dd>
</dl>
<h3>Log Message</h3>
<pre>Improvements to Animometer benchmark
https://bugs.webkit.org/show_bug.cgi?id=157738
Reviewed by Dean Jackson.
Provisionally reviewed by Said Abou-Hallawa.
Update tests.
* Animometer/tests/master/text.html: Ensure only three text sizes for
the three canvases.
* Animometer/tests/master/focus.html: Reduce the text size to fit with smaller
particle sizes.
* Animometer/tests/master/resources/focus.js: Remove the quadratic distribution for
particle sizes, and make it linear. Reduce the size variance. Shuffle the math to
reduce some calculations per frame. Fix the placement of the particles which might
otherwise be culled.
* Animometer/tests/master/resources/image-data.js: Reduce the particle size
to encourage larger scores.</pre>
<h3>Modified Paths</h3>
<ul>
<li><a href="#trunkPerformanceTestsAnimometertestsmasterfocushtml">trunk/PerformanceTests/Animometer/tests/master/focus.html</a></li>
<li><a href="#trunkPerformanceTestsAnimometertestsmasterresourcesfocusjs">trunk/PerformanceTests/Animometer/tests/master/resources/focus.js</a></li>
<li><a href="#trunkPerformanceTestsAnimometertestsmasterresourcesimagedatajs">trunk/PerformanceTests/Animometer/tests/master/resources/image-data.js</a></li>
<li><a href="#trunkPerformanceTestsAnimometertestsmastertexthtml">trunk/PerformanceTests/Animometer/tests/master/text.html</a></li>
<li><a href="#trunkPerformanceTestsChangeLog">trunk/PerformanceTests/ChangeLog</a></li>
</ul>
</div>
<div id="patch">
<h3>Diff</h3>
<a id="trunkPerformanceTestsAnimometertestsmasterfocushtml"></a>
<div class="modfile"><h4>Modified: trunk/PerformanceTests/Animometer/tests/master/focus.html (202314 => 202315)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/PerformanceTests/Animometer/tests/master/focus.html 2016-06-22 03:11:15 UTC (rev 202314)
+++ trunk/PerformanceTests/Animometer/tests/master/focus.html 2016-06-22 03:12:26 UTC (rev 202315)
</span><span class="lines">@@ -21,6 +21,7 @@
</span><span class="cx"> }
</span><span class="cx">
</span><span class="cx"> #center-text {
</span><ins>+ font-size: 90%;
</ins><span class="cx"> transform: translate3d(-50%, -50%, 0);
</span><span class="cx"> }
</span><span class="cx">
</span></span></pre></div>
<a id="trunkPerformanceTestsAnimometertestsmasterresourcesfocusjs"></a>
<div class="modfile"><h4>Modified: trunk/PerformanceTests/Animometer/tests/master/resources/focus.js (202314 => 202315)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/PerformanceTests/Animometer/tests/master/resources/focus.js 2016-06-22 03:11:15 UTC (rev 202314)
+++ trunk/PerformanceTests/Animometer/tests/master/resources/focus.js 2016-06-22 03:12:26 UTC (rev 202315)
</span><span class="lines">@@ -1,28 +1,26 @@
</span><span class="cx"> (function() {
</span><span class="cx">
</span><span class="cx"> var maxVerticalOffset = 50;
</span><del>-var radius = 10;
-var centerDiameter = 100;
-var sizeVariance = 80;
-var travelDistance = 70;
</del><ins>+var minimumDiameter = 30;
+var centerDiameter = 90;
+var sizeVariance = 60;
+var travelDistance = 50;
</ins><span class="cx">
</span><del>-var minObjectDepth = 0.2;
-var maxObjectDepth = 1.0;
-
</del><span class="cx"> var opacityMultiplier = 30;
</span><span class="cx">
</span><span class="cx"> var FocusElement = Utilities.createClass(
</span><span class="cx"> function(stage)
</span><span class="cx"> {
</span><del>- var topOffset = maxVerticalOffset * Stage.randomSign();
- var top = Stage.random(0, stage.size.height - 2 * radius - sizeVariance);
- var left = Stage.random(0, stage.size.width - 2 * radius - sizeVariance);
</del><ins>+ var size = minimumDiameter + sizeVariance;
</ins><span class="cx">
</span><span class="cx"> // size and blurring are a function of depth
</span><del>- this._depth = Utilities.lerp(1 - Math.pow(Pseudo.random(), 2), minObjectDepth, maxObjectDepth);
- var distance = Utilities.lerp(this._depth, 1, sizeVariance);
- var size = 2 * radius + sizeVariance - distance;
</del><ins>+ this._depth = Pseudo.random();
+ var distance = Utilities.lerp(this._depth, 0, sizeVariance);
+ size -= distance;
</ins><span class="cx">
</span><ins>+ var top = Stage.random(0, stage.size.height - size) - stage.maxBlurValue * 3;
+ var left = Stage.random(0, stage.size.width - size) - stage.maxBlurValue * 3;
+
</ins><span class="cx"> this.container = document.createElement('div');
</span><span class="cx"> this.container.style.width = (size + stage.maxBlurValue * 6) + "px";
</span><span class="cx"> this.container.style.height = (size + stage.maxBlurValue * 6) + "px";
</span><span class="lines">@@ -30,16 +28,15 @@
</span><span class="cx"> this.container.style.left = left + "px";
</span><span class="cx"> this.container.style.zIndex = Math.round((1 - this._depth) * 10);
</span><span class="cx">
</span><del>- var particle = Utilities.createElement("div", {}, this.container);
- particle.style.width = size + "px";
- particle.style.height = size + "px";
- particle.style.top = (stage.maxBlurValue * 3) + "px";
- particle.style.left = (stage.maxBlurValue * 3) + "px";
- this.particle = particle;
</del><ins>+ this.particle = Utilities.createElement("div", {}, this.container);
+ this.particle.style.width = size + "px";
+ this.particle.style.height = size + "px";
+ this.particle.style.top = (stage.maxBlurValue * 3) + "px";
+ this.particle.style.left = (stage.maxBlurValue * 3) + "px";
</ins><span class="cx">
</span><span class="cx"> var depthMultiplier = Utilities.lerp(1 - this._depth, 0.8, 1);
</span><del>- this._sinMultiplier = Pseudo.random() * Stage.randomSign() * depthMultiplier;
- this._cosMultiplier = Pseudo.random() * Stage.randomSign() * depthMultiplier;
</del><ins>+ this._sinMultiplier = Pseudo.random() * Stage.randomSign() * depthMultiplier * travelDistance;
+ this._cosMultiplier = Pseudo.random() * Stage.randomSign() * depthMultiplier * travelDistance;
</ins><span class="cx"> }, {
</span><span class="cx">
</span><span class="cx"> hide: function()
</span><span class="lines">@@ -131,8 +128,8 @@
</span><span class="cx"> animate: function()
</span><span class="cx"> {
</span><span class="cx"> var time = this._benchmark.timestamp;
</span><del>- var sinFactor = Math.sin(time / this.movementDuration) * travelDistance;
- var cosFactor = Math.cos(time / this.movementDuration) * travelDistance;
</del><ins>+ var sinFactor = Math.sin(time / this.movementDuration);
+ var cosFactor = Math.cos(time / this.movementDuration);
</ins><span class="cx">
</span><span class="cx"> var focusProgress = 0.5 + 0.5 * Math.sin(time / this.focusDuration);
</span><span class="cx"> this._focalPoint = focusProgress;
</span></span></pre></div>
<a id="trunkPerformanceTestsAnimometertestsmasterresourcesimagedatajs"></a>
<div class="modfile"><h4>Modified: trunk/PerformanceTests/Animometer/tests/master/resources/image-data.js (202314 => 202315)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/PerformanceTests/Animometer/tests/master/resources/image-data.js 2016-06-22 03:11:15 UTC (rev 202314)
+++ trunk/PerformanceTests/Animometer/tests/master/resources/image-data.js 2016-06-22 03:12:26 UTC (rev 202315)
</span><span class="lines">@@ -8,10 +8,10 @@
</span><span class="cx"> this._offsetIndex = 0;
</span><span class="cx"> }, {
</span><span class="cx">
</span><del>- imageWidth: 100,
- imageHeight: 100,
</del><ins>+ imageWidth: 50,
+ imageHeight: 50,
</ins><span class="cx"> pixelStride: 4,
</span><del>- rowStride: 400,
</del><ins>+ rowStride: 200,
</ins><span class="cx"> weightNegativeThreshold: 0.04,
</span><span class="cx"> weightPositiveThreshold: 0.96,
</span><span class="cx"> imageSrcs: [
</span></span></pre></div>
<a id="trunkPerformanceTestsAnimometertestsmastertexthtml"></a>
<div class="modfile"><h4>Modified: trunk/PerformanceTests/Animometer/tests/master/text.html (202314 => 202315)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/PerformanceTests/Animometer/tests/master/text.html 2016-06-22 03:11:15 UTC (rev 202314)
+++ trunk/PerformanceTests/Animometer/tests/master/text.html 2016-06-22 03:12:26 UTC (rev 202315)
</span><span class="lines">@@ -7,29 +7,16 @@
</span><span class="cx">
</span><span class="cx"> #stage {
</span><span class="cx"> font-family: Helvetica;
</span><del>- font-size: 48px;
- background-color: #313534;/* #d1948c;*/
</del><ins>+ font-size: 52px;
+ background-color: #313534;
</ins><span class="cx"> }
</span><del>- @media (min-device-height: 768px) and (max-device-height: 1024px) {
</del><ins>+ @media (max-width: 900px) {
</ins><span class="cx"> #stage {
</span><span class="cx"> font-size: 40px;
</span><span class="cx"> }
</span><span class="cx"> }
</span><del>- @media screen and (max-device-width: 414px),
- screen and (max-device-height: 414px) and (orientation: landscape) {
</del><ins>+ @media (max-width: 568px) {
</ins><span class="cx"> #stage {
</span><del>- font-size: 36px;
- }
- }
- @media screen and (max-device-width: 375px),
- screen and (max-device-height: 375px) and (orientation: landscape) {
- #stage {
- font-size: 30px;
- }
- }
- @media screen and (max-device-width: 320px),
- screen and (max-device-height: 320px) and (orientation: landscape) {
- #stage {
</del><span class="cx"> font-size: 28px;
</span><span class="cx"> }
</span><span class="cx"> }
</span></span></pre></div>
<a id="trunkPerformanceTestsChangeLog"></a>
<div class="modfile"><h4>Modified: trunk/PerformanceTests/ChangeLog (202314 => 202315)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/PerformanceTests/ChangeLog 2016-06-22 03:11:15 UTC (rev 202314)
+++ trunk/PerformanceTests/ChangeLog 2016-06-22 03:12:26 UTC (rev 202315)
</span><span class="lines">@@ -6,6 +6,27 @@
</span><span class="cx"> Reviewed by Dean Jackson.
</span><span class="cx"> Provisionally reviewed by Said Abou-Hallawa.
</span><span class="cx">
</span><ins>+ Update tests.
+
+ * Animometer/tests/master/text.html: Ensure only three text sizes for
+ the three canvases.
+ * Animometer/tests/master/focus.html: Reduce the text size to fit with smaller
+ particle sizes.
+ * Animometer/tests/master/resources/focus.js: Remove the quadratic distribution for
+ particle sizes, and make it linear. Reduce the size variance. Shuffle the math to
+ reduce some calculations per frame. Fix the placement of the particles which might
+ otherwise be culled.
+ * Animometer/tests/master/resources/image-data.js: Reduce the particle size
+ to encourage larger scores.
+
+2016-06-21 Jon Lee <jonlee@apple.com>
+
+ Improvements to Animometer benchmark
+ https://bugs.webkit.org/show_bug.cgi?id=157738
+
+ Reviewed by Dean Jackson.
+ Provisionally reviewed by Said Abou-Hallawa.
+
</ins><span class="cx"> Include confidence interval for the final score, and store the canvas
</span><span class="cx"> size in the serialization so that it is accurately shown in results.
</span><span class="cx">
</span></span></pre>
</div>
</div>
</body>
</html>