Diff
Modified: trunk/PerformanceTests/Animometer/resources/debug-runner/tests.js (198508 => 198509)
--- trunk/PerformanceTests/Animometer/resources/debug-runner/tests.js 2016-03-22 00:22:14 UTC (rev 198508)
+++ trunk/PerformanceTests/Animometer/resources/debug-runner/tests.js 2016-03-22 00:30:44 UTC (rev 198509)
@@ -168,6 +168,10 @@
{
url: "dom/leaves.html",
name: "Leaves 2.0"
+ },
+ {
+ url: "dom/compositing-transforms.html?particleWidth=50&particleHeight=50&filters=yes&imageSrc=../resources/yin-yang.svg",
+ name: "Composited Transforms"
}
]
));
@@ -175,10 +179,6 @@
Suites.push(new Suite("Canvas suite",
[
{
- url: "bouncing-particles/bouncing-canvas-shapes.html?particleWidth=12&particleHeight=12&shape=circle",
- name: "canvas bouncing circles"
- },
- {
url: "bouncing-particles/bouncing-canvas-shapes.html?particleWidth=40&particleHeight=40&shape=rect&clip=star",
name: "canvas bouncing clipped rects"
},
@@ -194,6 +194,18 @@
url: "bouncing-particles/bouncing-canvas-images.html?particleWidth=80&particleHeight=80&imageSrc=../resources/yin-yang.png",
name: "canvas bouncing PNG images"
},
+ {
+ url: "simple/simple-canvas-paths.html?pathType=strokes",
+ name: "Stroke shapes"
+ },
+ {
+ url: "simple/simple-canvas-paths.html?pathType=fills",
+ name: "Fill shapes"
+ },
+ {
+ url: "simple/tiled-canvas-image.html",
+ name: "Canvas put/get image data"
+ },
]
));
@@ -222,6 +234,15 @@
]
));
+Suites.push(new Suite("3D Graphics",
+ [
+ {
+ url: "3d/webgl.html",
+ name: "WebGL"
+ },
+ ]
+));
+
Suites.push(new Suite("Basic canvas path suite",
[
{
@@ -281,6 +302,10 @@
name: "Canvas rects"
},
{
+ url: "simple/simple-canvas-paths.html?pathType=ellipse",
+ name: "Canvas ellipses"
+ },
+ {
url: "simple/simple-canvas-paths.html?pathType=lineFill",
name: "Canvas line path, fill"
},
@@ -305,34 +330,8 @@
name: "Canvas rects, fill"
},
{
- url: "simple/tiled-canvas-image.html",
- name: "Canvas put/get image data"
- },
+ url: "simple/simple-canvas-paths.html?pathType=ellipseFill",
+ name: "Canvas ellipses, fill"
+ }
]
));
-
-Suites.push(new Suite("3D Graphics",
- [
- {
- url: "3d/webgl.html",
- name: "WebGL"
- },
- ]
-));
-
-Suites.push(new Suite("Miscellaneous Tests",
- [
- {
- url: "misc/compositing-transforms.html?particleWidth=50&particleHeight=50&filters=yes&imageSrc=../resources/yin-yang.svg",
- name: "Composited Transforms"
- },
- {
- url: "misc/canvas-electrons.html",
- name: "Canvas electrons"
- },
- {
- url: "misc/canvas-stars.html",
- name: "Canvas stars"
- },
- ]
-));
Modified: trunk/PerformanceTests/Animometer/resources/runner/tests.js (198508 => 198509)
--- trunk/PerformanceTests/Animometer/resources/runner/tests.js 2016-03-22 00:22:14 UTC (rev 198508)
+++ trunk/PerformanceTests/Animometer/resources/runner/tests.js 2016-03-22 00:30:44 UTC (rev 198509)
@@ -25,18 +25,14 @@
name: "Leaves"
},
{
- url: "master/canvas-stage.html?pathType=linePath&lineJoin=round&lineCap=round",
- name: "Canvas line path, round join"
+ url: "master/canvas-stage.html?pathType=linePath",
+ name: "Paths"
},
{
url: "master/canvas-stage.html?pathType=line&lineCap=square",
name: "Canvas line segments"
},
{
- url: "master/text.html",
- name: "A to Z"
- },
- {
url: "master/focus.html",
name: "Focus"
},
@@ -45,7 +41,7 @@
name: "Images"
},
{
- url: "master/international.html",
+ url: "master/text.html",
name: "Design"
},
{
Modified: trunk/PerformanceTests/Animometer/tests/bouncing-particles/resources/bouncing-tagged-images.js (198508 => 198509)
--- trunk/PerformanceTests/Animometer/tests/bouncing-particles/resources/bouncing-tagged-images.js 2016-03-22 00:22:14 UTC (rev 198508)
+++ trunk/PerformanceTests/Animometer/tests/bouncing-particles/resources/bouncing-tagged-images.js 2016-03-22 00:30:44 UTC (rev 198509)
@@ -8,7 +8,7 @@
this.element = document.createElement("img");
this.element.style.width = this.size.x + "px";
this.element.style.height = this.size.y + "px";
- this.element.setAttribute("src", stage.images[Stage.randomInt(0, stage.images.length - 1)].src);
+ this.element.setAttribute("src", Stage.randomElementInArray(stage.images).src);
stage.element.appendChild(this.element);
this._move();
Copied: trunk/PerformanceTests/Animometer/tests/dom/compositing-transforms.html (from rev 198494, trunk/PerformanceTests/Animometer/tests/misc/compositing-transforms.html) (0 => 198509)
--- trunk/PerformanceTests/Animometer/tests/dom/compositing-transforms.html (rev 0)
+++ trunk/PerformanceTests/Animometer/tests/dom/compositing-transforms.html 2016-03-22 00:30:44 UTC (rev 198509)
@@ -0,0 +1,24 @@
+<!DOCTYPE html>
+<html>
+<head>
+ <meta charset="utf-8">
+ <link rel="stylesheet" type="text/css" href=""
+ <style>
+ img {
+ position: absolute;
+ width: 80px;
+ height: 80px;
+ }
+ </style>
+</head>
+<body>
+ <div id="stage"></div>
+ <script src=""
+ <script src=""
+ <script src=""
+ <script src=""
+ <script src=""
+ <script src=""
+ <script src=""
+</body>
+</html>
Copied: trunk/PerformanceTests/Animometer/tests/dom/resources/compositing-transforms.js (from rev 198494, trunk/PerformanceTests/Animometer/tests/misc/resources/compositing-transforms.js) (0 => 198509)
--- trunk/PerformanceTests/Animometer/tests/dom/resources/compositing-transforms.js (rev 0)
+++ trunk/PerformanceTests/Animometer/tests/dom/resources/compositing-transforms.js 2016-03-22 00:30:44 UTC (rev 198509)
@@ -0,0 +1,66 @@
+(function() {
+
+BouncingCompositedImage = Utilities.createSubclass(BouncingParticle,
+ function(stage)
+ {
+ BouncingParticle.call(this, stage);
+
+ this.element = document.createElement("img");
+ this.element.style.width = this.size.x + "px";
+ this.element.style.height = this.size.y + "px";
+ this.element.setAttribute("src", stage.imageSrc);
+
+ if (stage.useFilters)
+ this.element.style.filter = "hue-rotate(" + Stage.randomAngle() + "rad)";
+
+ stage.element.appendChild(this.element);
+ this._move();
+ }, {
+
+ _move: function()
+ {
+ this.element.style.transform = "translate3d(" + this.position.x + "px," + this.position.y + "px, 0) " + this.rotater.rotateZ();
+ },
+
+ animate: function(timeDelta)
+ {
+ BouncingParticle.prototype.animate.call(this, timeDelta);
+ this._move();
+ }
+});
+
+CompositingTransformsStage = Utilities.createSubclass(BouncingParticlesStage,
+ function()
+ {
+ BouncingParticlesStage.call(this);
+ }, {
+
+ initialize: function(benchmark, options)
+ {
+ BouncingParticlesStage.prototype.initialize.call(this, benchmark, options);
+
+ this.imageSrc = options["imageSrc"] || "../resources/yin-yang.svg";
+ this.useFilters = options["filters"] == "yes";
+ },
+
+ createParticle: function()
+ {
+ return new BouncingCompositedImage(this);
+ },
+
+ particleWillBeRemoved: function(particle)
+ {
+ particle.element.remove();
+ }
+});
+
+CompositedTransformsBenchmark = Utilities.createSubclass(Benchmark,
+ function(options)
+ {
+ Benchmark.call(this, new CompositingTransformsStage(), options);
+ }
+);
+
+window.benchmarkClass = CompositedTransformsBenchmark;
+
+})();
Modified: trunk/PerformanceTests/Animometer/tests/dom/resources/leaves.js (198508 => 198509)
--- trunk/PerformanceTests/Animometer/tests/dom/resources/leaves.js 2016-03-22 00:22:14 UTC (rev 198508)
+++ trunk/PerformanceTests/Animometer/tests/dom/resources/leaves.js 2016-03-22 00:30:44 UTC (rev 198509)
@@ -2,7 +2,7 @@
function(stage)
{
this.element = document.createElement("img");
- this.element.setAttribute("src", stage.images[Stage.randomInt(0, stage.images.length - 1)].src);
+ this.element.setAttribute("src", Stage.randomElementInArray(stage.images).src);
stage.element.appendChild(this.element);
Particle.call(this, stage);
Deleted: trunk/PerformanceTests/Animometer/tests/master/international.html (198508 => 198509)
--- trunk/PerformanceTests/Animometer/tests/master/international.html 2016-03-22 00:22:14 UTC (rev 198508)
+++ trunk/PerformanceTests/Animometer/tests/master/international.html 2016-03-22 00:30:44 UTC (rev 198509)
@@ -1,40 +0,0 @@
-<!DOCTYPE html>
-<html>
-<head>
- <meta charset="utf-8">
- <link rel="stylesheet" type="text/css" href=""
- <style type="text/css">
-
- #stage {
- font-family: Helvetica;
- font-size: 48px;
- }
- #stage div {
- width: 60%;
- position: absolute;
- text-align: center;
- }
- #template {
- color: #111;
- }
- </style>
-</head>
-<body>
- <div id="stage">
- <div id="template">
- <p>设计</p>
- <p class="rtl">تصميم</p>
- <p>дизайн</p>
- <p>デザイン</p>
- <p class="rtl">עיצוב</p>
- <p>디자인</p>
- </div>
- </div>
- <script src=""
- <script src=""
- <script src=""
- <script src=""
- <script src=""
- <script src=""
-</body>
-</html>
Modified: trunk/PerformanceTests/Animometer/tests/master/resources/canvas-stage.js (198508 => 198509)
--- trunk/PerformanceTests/Animometer/tests/master/resources/canvas-stage.js 2016-03-22 00:22:14 UTC (rev 198508)
+++ trunk/PerformanceTests/Animometer/tests/master/resources/canvas-stage.js 2016-03-22 00:30:44 UTC (rev 198509)
@@ -27,8 +27,12 @@
if (newIndex < 0) {
this.offsetIndex = 0;
newIndex = -newIndex;
- for (var i = 0; i < newIndex; ++i)
- this.objects.push(new this._canvasObject(this));
+ for (var i = 0; i < newIndex; ++i) {
+ if (this._canvasObject.constructor === Array)
+ this.objects.push(new (Stage.randomElementInArray(this._canvasObject))(this));
+ else
+ this.objects.push(new this._canvasObject(this));
+ }
} else
this.offsetIndex = newIndex;
},
Modified: trunk/PerformanceTests/Animometer/tests/master/resources/canvas-tests.js (198508 => 198509)
--- trunk/PerformanceTests/Animometer/tests/master/resources/canvas-tests.js 2016-03-22 00:22:14 UTC (rev 198508)
+++ trunk/PerformanceTests/Animometer/tests/master/resources/canvas-tests.js 2016-03-22 00:30:44 UTC (rev 198509)
@@ -81,44 +81,96 @@
// CanvasLinePoint contains no draw() method since it is either moveTo or
// lineTo depending on its index.
CanvasLinePoint = Utilities.createClass(
- function(stage, coordinateMaximum)
+ function(stage)
{
- var X_LOOPS = 40;
- var Y_LOOPS = 20;
+ var colors = ["#101010", "#808080", "#c0c0c0", "#101010", "#808080", "#c0c0c0", "#e01040"];
+ this.color = Stage.randomElementInArray(colors);
+ this.width = Math.pow(Pseudo.random(), 5) * 20 + 1;
+ this.isSplit = Pseudo.random() > 0.95;
- var offsets = [[-2, -1], [2, 1], [-1, 0], [1, 0], [-1, 2], [1, -2]];
- var offset = offsets[Math.floor(Pseudo.random() * offsets.length)];
+ var nextPoint;
+ if (stage.objects.length)
+ nextPoint = this.randomPoint(stage, stage.objects[stage.objects.length - 1].coordinate);
+ else
+ nextPoint = this.randomPoint(stage, this.gridSize.center);
+ this.point = nextPoint.point;
+ this.coordinate = nextPoint.coordinate;
+ }, {
- this.coordinate = new Point(X_LOOPS/2, Y_LOOPS/2);
+ gridSize: new Point(80, 40),
+ offsets: [
+ new Point(-4, 0),
+ new Point(2, 0),
+ new Point(1, -2),
+ new Point(1, 2),
+ ],
+
+ randomPoint: function(stage, startCoordinate)
+ {
+ var coordinate = startCoordinate;
if (stage.objects.length) {
- var head = stage.objects[stage.objects.length - 1].coordinate;
- this.coordinate.x = head.x;
- this.coordinate.y = head.y;
+ var offset = Stage.randomElementInArray(this.offsets);
+
+ coordinate = coordinate.add(offset);
+ if (coordinate.x < 0 || coordinate.x > this.gridSize.width)
+ coordinate.x -= offset.x * 2;
+ if (coordinate.y < 0 || coordinate.y > this.gridSize.height)
+ coordinate.y -= offset.y * 2;
}
- var nextCoordinate = this.coordinate.x + offset[0];
- if (nextCoordinate < 0 || nextCoordinate > X_LOOPS)
- this.coordinate.x -= offset[0];
- else
- this.coordinate.x = nextCoordinate;
- nextCoordinate = this.coordinate.y + offset[1];
- if (nextCoordinate < 0 || nextCoordinate > Y_LOOPS)
- this.coordinate.y -= offset[1];
- else
- this.coordinate.y = nextCoordinate;
+ var x = (coordinate.x + .5) * stage.size.x / (this.gridSize.width + 1);
+ var y = (coordinate.y + .5) * stage.size.y / (this.gridSize.height + 1);
+ return {
+ point: new Point(x, y),
+ coordinate: coordinate
+ };
+ },
- var xOff = .25 * (this.coordinate.y % 2);
- var randX = (xOff + this.coordinate.x) * stage.size.x / X_LOOPS;
- var randY = this.coordinate.y * stage.size.y / Y_LOOPS;
- var colors = ["#101010", "#808080", "#c0c0c0", "#101010", "#808080", "#c0c0c0", "#e01040"];
- this.color = colors[Math.floor(Pseudo.random() * colors.length)];
+ draw: function(context)
+ {
+ context.lineTo(this.point.x, this.point.y);
+ }
+});
- this.width = Math.pow(Pseudo.random(), 5) * 20 + 1;
- this.isSplit = Pseudo.random() > 0.9;
- this.point = new Point(randX, randY);
+CanvasQuadraticSegment = Utilities.createSubclass(CanvasLinePoint,
+ function(stage)
+ {
+ CanvasLinePoint.call(this, stage);
+ // The chosen point is instead the control point.
+ this._point2 = this.point;
+
+ // Get another random point for the actual end point of the segment.
+ var nextPoint = this.randomPoint(stage, this.coordinate);
+ this.point = nextPoint.point;
+ this.coordinate = nextPoint.coordinate;
+ }, {
+
+ draw: function(context)
+ {
+ context.quadraticCurveTo(this._point2.x, this._point2.y, this.point.x, this.point.y);
}
-);
+});
+CanvasBezierSegment = Utilities.createSubclass(CanvasLinePoint,
+ function(stage)
+ {
+ CanvasLinePoint.call(this, stage);
+ // The chosen point is instead the first control point.
+ this._point2 = this.point;
+ var nextPoint = this.randomPoint(stage, this.coordinate);
+ this._point3 = nextPoint.point;
+
+ nextPoint = this.randomPoint(stage, nextPoint.coordinate);
+ this.point = nextPoint.point;
+ this.coordinate = nextPoint.coordinate;
+ }, {
+
+ draw: function(context, off)
+ {
+ context.bezierCurveTo(this._point2.x, this._point2.y, this._point3.x, this._point3.y, this.point.x, this.point.y);
+ }
+});
+
// === STAGES ===
CanvasLineSegmentStage = Utilities.createSubclass(SimpleCanvasStage,
@@ -190,7 +242,7 @@
CanvasLinePathStage = Utilities.createSubclass(SimpleCanvasStage,
function()
{
- SimpleCanvasStage.call(this, CanvasLinePoint);
+ SimpleCanvasStage.call(this, [CanvasLinePoint, CanvasLinePoint, CanvasQuadraticSegment, CanvasBezierSegment]);
}, {
initialize: function(benchmark, options)
@@ -210,19 +262,21 @@
if (i == this.offsetIndex) {
context.lineWidth = object.width;
context.strokeStyle = object.color;
+ context.beginPath();
context.moveTo(object.point.x, object.point.y);
} else {
+ object.draw(context);
+
if (object.isSplit) {
context.stroke();
context.lineWidth = object.width;
context.strokeStyle = object.color;
context.beginPath();
+ context.moveTo(object.point.x, object.point.y);
}
- context.lineTo(object.point.x, object.point.y);
-
- if (Pseudo.random() > 0.999)
+ if (Pseudo.random() > 0.995)
object.isSplit = !object.isSplit;
}
}
Modified: trunk/PerformanceTests/Animometer/tests/master/resources/dom-particles.js (198508 => 198509)
--- trunk/PerformanceTests/Animometer/tests/master/resources/dom-particles.js 2016-03-22 00:22:14 UTC (rev 198508)
+++ trunk/PerformanceTests/Animometer/tests/master/resources/dom-particles.js 2016-03-22 00:30:44 UTC (rev 198509)
@@ -13,7 +13,7 @@
{
Particle.prototype.reset.call(this);
- var emitLocation = this.stage.emitLocation[Stage.randomInt(0, this.stage.emitLocation.length - 1)];
+ var emitLocation = Stage.randomElementInArray(this.stage.emitLocation);
this.position = new Point(emitLocation.x, emitLocation.y);
var angle = Stage.randomInt(0, this.stage.emitSteps) / this.stage.emitSteps * Math.PI * 2 + Stage.dateCounterValue(100) * this.stage.emissionSpin;
Modified: trunk/PerformanceTests/Animometer/tests/master/resources/image-data.js (198508 => 198509)
--- trunk/PerformanceTests/Animometer/tests/master/resources/image-data.js 2016-03-22 00:22:14 UTC (rev 198508)
+++ trunk/PerformanceTests/Animometer/tests/master/resources/image-data.js 2016-03-22 00:30:44 UTC (rev 198509)
@@ -146,7 +146,7 @@
context.putImageData(imageData, 0, 0);
else {
this._refreshElement(element);
- element.getContext("2d").drawImage(this.images[Stage.randomInt(0, this.images.length - 1)], 0, 0, this.imageWidth, this.imageHeight);
+ element.getContext("2d").drawImage(Stage.randomElementInArray(this.images), 0, 0, this.imageWidth, this.imageHeight);
}
}
},
Modified: trunk/PerformanceTests/Animometer/tests/master/resources/leaves.js (198508 => 198509)
--- trunk/PerformanceTests/Animometer/tests/master/resources/leaves.js 2016-03-22 00:22:14 UTC (rev 198508)
+++ trunk/PerformanceTests/Animometer/tests/master/resources/leaves.js 2016-03-22 00:30:44 UTC (rev 198509)
@@ -2,7 +2,7 @@
function(stage)
{
this.element = document.createElement("img");
- this.element.setAttribute("src", stage.images[Stage.randomInt(0, stage.images.length - 1)].src);
+ this.element.setAttribute("src", Stage.randomElementInArray(stage.images).src);
var sizeString = this.sizeMinimum + "px";
this.element.style.width = sizeString;
this.element.style.height = sizeString;
Modified: trunk/PerformanceTests/Animometer/tests/master/resources/text.js (198508 => 198509)
--- trunk/PerformanceTests/Animometer/tests/master/resources/text.js 2016-03-22 00:22:14 UTC (rev 198508)
+++ trunk/PerformanceTests/Animometer/tests/master/resources/text.js 2016-03-22 00:30:44 UTC (rev 198509)
@@ -10,12 +10,20 @@
}, {
shadowFalloff: new UnitBezier(new Point(0.015, 0.750), new Point(0.755, 0.235)),
- shimmerAverage: 0.4,
+ shimmerAverage: 0,
shimmerMax: 0.5,
millisecondsPerRotation: 1000 / (.26 * Math.PI * 2),
- particleDistance: 1,
+ particleDistanceX: 1.5,
+ particleDistanceY: .5,
lightnessMin: 13,
lightnessMax: 94,
+ gradients: [
+ [10, 176, 176, 209, 148, 140],
+ [171, 120, 154, 245, 196, 154],
+ [224, 99, 99, 71, 134, 148],
+ [101, 100, 117, 80, 230, 175],
+ [232, 165, 30, 69, 186, 172]
+ ],
initialize: function(benchmark)
{
@@ -66,21 +74,24 @@
var x = 0;
var y = 0;
var progress = 0;
- var stepX = Math.sin(angle) * this.particleDistance;
- var stepY = Math.cos(angle) * this.particleDistance;
+ var stepX = Math.sin(angle) * this.particleDistanceX;
+ var stepY = Math.cos(angle) * this.particleDistanceY;
+ var gradient = this.gradients[Math.floor(angle/(Math.PI * 2)) % this.gradients.length];
+ var offset = Stage.dateCounterValue(200);
for (var i = 0; i < this._offsetIndex; ++i) {
- x += stepX;
- y += stepY;
-
var element = this.testElements[i];
var colorProgress = this.shadowFalloff.solve(progress);
- var shimmer = Math.sin(Stage.dateCounterValue(100) - colorProgress);
- colorProgress += Utilities.lerp(shimmer, this.shimmerAverage, this.shimmerMax);
- var interpolatedLightness = Math.round(Utilities.lerp(Math.max(Math.min(colorProgress, 1), 0), this.lightnessMin, this.lightnessMax));
+ var shimmer = Math.sin(offset - colorProgress);
+ colorProgress = Math.max(Math.min(colorProgress + Utilities.lerp(shimmer, this.shimmerAverage, this.shimmerMax), 1), 0);
+ var r = Math.round(Utilities.lerp(colorProgress, gradient[0], gradient[3]));
+ var g = Math.round(Utilities.lerp(colorProgress, gradient[1], gradient[4]));
+ var b = Math.round(Utilities.lerp(colorProgress, gradient[2], gradient[5]));
+ element.style.color = "rgb(" + r + "," + g + "," + b + ")";
- element.style.color = "hsl(0,0%," + interpolatedLightness + "%)";
- element.style.transform = "translateX(" + Math.floor(y) + "px) translateY(" + Math.floor(x) + "px)";
+ x += stepX;
+ y += stepY;
+ element.style.transform = "translateX(" + Math.floor(x) + "px) translateY(" + Math.floor(y) + "px)";
progress += this._stepProgress;
}
Modified: trunk/PerformanceTests/Animometer/tests/master/text.html (198508 => 198509)
--- trunk/PerformanceTests/Animometer/tests/master/text.html 2016-03-22 00:22:14 UTC (rev 198508)
+++ trunk/PerformanceTests/Animometer/tests/master/text.html 2016-03-22 00:30:44 UTC (rev 198509)
@@ -8,20 +8,57 @@
#stage {
font-family: Helvetica;
font-size: 48px;
+ background-color: #313534;/* #d1948c;*/
}
#stage div {
- width: 21em;
+ width: 80%;
+ height: 90%;
position: absolute;
+ text-align: center;
}
#template {
- color: #111;
+ color: #FCFCFC;
}
+ table {
+ position: relative;
+ width: 100%;
+ height: 100%;
+ }
+ td {
+ width: 33%;
+ }
+ tr {
+ height: 20%;
+ }
</style>
</head>
<body>
<div id="stage">
<div id="template">
- Whenever the black fox jumped the squirrel gazed suspiciously. Amazingly few discotheques provide jukeboxes.
+ <table>
+ <tbody>
+ <tr>
+ <td>σχέδιο</td>
+ <td>设计</td>
+ <td>suunnittelu</td>
+ </tr>
+ <tr>
+ <td>design</td>
+ <td>дизайн</td>
+ <td class="rtl">تصميم</td>
+ </tr>
+ <tr>
+ <td>디자인</td>
+ <td>conception</td>
+ <td>デザイン</td>
+ </tr>
+ <tr>
+ <td>konstruktion</td>
+ <td class="rtl">עיצוב</td>
+ <td>diseño</td>
+ </tr>
+ </tbody>
+ </table>
</div>
</div>
<script src=""
Modified: trunk/PerformanceTests/Animometer/tests/resources/main.js (198508 => 198509)
--- trunk/PerformanceTests/Animometer/tests/resources/main.js 2016-03-22 00:22:14 UTC (rev 198508)
+++ trunk/PerformanceTests/Animometer/tests/resources/main.js 2016-03-22 00:30:44 UTC (rev 198509)
@@ -720,6 +720,11 @@
return filterList[this.randomInt(0, filterList.length)];
},
+ randomElementInArray: function(array)
+ {
+ return array[Stage.randomInt(0, array.length - 1)];
+ },
+
rotatingColor: function(cycleLengthMs, saturation, lightness)
{
return "hsl("
Modified: trunk/PerformanceTests/Animometer/tests/simple/resources/simple-canvas-paths.js (198508 => 198509)
--- trunk/PerformanceTests/Animometer/tests/simple/resources/simple-canvas-paths.js 2016-03-22 00:22:14 UTC (rev 198508)
+++ trunk/PerformanceTests/Animometer/tests/simple/resources/simple-canvas-paths.js 2016-03-22 00:30:44 UTC (rev 198509)
@@ -209,6 +209,78 @@
}
});
+CanvasEllipse = Utilities.createClass(
+ function(stage) {
+ this._radius = new Point(Stage.randomInt(20, 200), Stage.randomInt(20, 200));
+ var toCenter = Stage.randomPosition(stage.size).subtract(this._radius.multiply(.5));
+
+ this._center = Stage.randomPosition(this._radius).add(toCenter);
+ this._rotation = Stage.randomAngle();
+ this._startAngle = Stage.randomAngle();
+ this._endAngle = Stage.randomAngle();
+ this._anticlockwise = Stage.randomBool();
+ this._color = Stage.randomColor();
+ this._lineWidth = Stage.randomInt(1, 20);
+ }, {
+
+ draw: function(context) {
+ context.strokeStyle = this._color;
+ context.lineWidth = this._lineWidth;
+ context.beginPath();
+ context.ellipse(this._center.x, this._center.y, this._radius.width, this._radius.height, this._rotation, this._startAngle, this._endAngle, this._anticlockwise);
+ context.stroke();
+ }
+});
+
+CanvasEllipseFill = Utilities.createClass(
+ function(stage) {
+ CanvasEllipse.call(this, stage);
+ }, {
+
+ draw: function(context) {
+ context.fillStyle = this._color;
+ context.beginPath();
+ context.ellipse(this._center.x, this._center.y, this._radius.width, this._radius.height, this._rotation, this._startAngle, this._endAngle, this._anticlockwise);
+ context.fill();
+ }
+});
+
+CanvasStroke = Utilities.createClass(
+ function (stage) {
+ this._object = new (Stage.randomElementInArray(this.objectTypes))(stage);
+ }, {
+
+ objectTypes: [
+ CanvasQuadraticSegment,
+ CanvasBezierSegment,
+ CanvasArcToSegment,
+ CanvasArcSegment,
+ CanvasRect,
+ CanvasEllipse
+ ],
+
+ draw: function(context) {
+ this._object.draw(context);
+ }
+});
+
+CanvasFill = Utilities.createClass(
+ function (stage) {
+ this._object = new (Stage.randomElementInArray(this.objectTypes))(stage);
+ }, {
+
+ objectTypes: [
+ CanvasArcToSegmentFill,
+ CanvasArcSegmentFill,
+ CanvasRectFill,
+ CanvasEllipseFill
+ ],
+
+ draw: function(context) {
+ this._object.draw(context);
+ }
+});
+
// === STAGES ===
SimpleCanvasPathStrokeStage = Utilities.createSubclass(SimpleCanvasStage,
@@ -340,6 +412,9 @@
case "rect":
stage = new SimpleCanvasStage(CanvasRect);
break;
+ case "ellipse":
+ stage = new SimpleCanvasStage(CanvasEllipse);
+ break;
case "lineFill":
stage = new SimpleCanvasPathFillStage(CanvasLinePoint);
break;
@@ -358,6 +433,15 @@
case "rectFill":
stage = new SimpleCanvasStage(CanvasRectFill);
break;
+ case "ellipseFill":
+ stage = new SimpleCanvasStage(CanvasEllipseFill);
+ break;
+ case "strokes":
+ stage = new SimpleCanvasStage(CanvasStroke);
+ break;
+ case "fills":
+ stage = new SimpleCanvasStage(CanvasFill);
+ break;
}
Benchmark.call(this, stage, options);
Modified: trunk/PerformanceTests/ChangeLog (198508 => 198509)
--- trunk/PerformanceTests/ChangeLog 2016-03-22 00:22:14 UTC (rev 198508)
+++ trunk/PerformanceTests/ChangeLog 2016-03-22 00:30:44 UTC (rev 198509)
@@ -1,3 +1,79 @@
+2016-03-21 Jon Lee <jon...@apple.com>
+
+ Update benchmark tests
+ https://bugs.webkit.org/show_bug.cgi?id=155723
+
+ Reviewed by Darin Adler.
+ Provisionally reviewed by Said Abou-Hallawa.
+
+ Add quadratic and bezier segments to the canvas path test.
+
+ * Animometer/resources/runner/tests.js: Some of the query strings are unnecessary.
+ Rename the test.
+ * Animometer/tests/master/resources/canvas-stage.js:
+ (tune): Update to be able to take an array of possible constructors. Choose one randomly.
+ * Animometer/tests/master/resources/canvas-tests.js:
+ (CanvasLinePoint.Utilities.createClass): Move the point selection out to a separate
+ function called randomPoint() for reuse. Move X_LOOPS, Y_LOOPS, and offsets into the
+ class definition.
+ (randomPoint): Scale the grid down a little bit so that the lines along the edge of the
+ canvas are not cut off when the stroke size is thick.
+ (CanvasQuadraticSegment): Added.
+ (CanvasBezierSegment): Added.
+ (SimpleCanvasStage): Pass in an array of the different segment types. Since line segments
+ are short compared to the curved ones, make it twice as likely to render a line segment.
+ (SimpleCanvasStage.animate): Update the drawing code so that we render all line segments.
+
+ Add a helper method that selects a random element from an array.
+
+ * Animometer/tests/resources/main.js:
+ (Stage.randomElementInArray): Select a random element from the provided array.
+
+ * Animometer/tests/bouncing-particles/resources/bouncing-tagged-images.js: Refactor.
+ * Animometer/tests/dom/resources/leaves.js: Ditto.
+ * Animometer/tests/master/resources/dom-particles.js: Ditto.
+ * Animometer/tests/master/resources/image-data.js: Ditto.
+ * Animometer/tests/master/resources/leaves.js: Ditto.
+ * Animometer/tests/simple/resources/simple-canvas-paths.js: Ditto.
+
+ Add canvas tests that includes all stroke and fill paths. This makes it possible to avoid having to
+ include the full simple canvas suite for perf testing.
+
+ * Animometer/resources/debug-runner/tests.js: Add new tests. Move the canvas test into the Canvas
+ suite.
+ * Animometer/tests/simple/resources/simple-canvas-paths.js: Add a CanvasStroke and CanvasFill particle
+ that random selects an object to render.
+
+ * Animometer/resources/debug-runner/tests.js: Move 3D suite before basic canvas suite.
+ When updating the perf bot script, we will include the suites up to this one, but exclude
+ the basic canvas suite.
+
+ Move compositing transforms test to HTML suite and remove the empty Miscellaneous suite.
+
+ * Animometer/resources/debug-runner/tests.js:
+ * Animometer/tests/dom/compositing-transforms.html: Renamed from PerformanceTests/Animometer/tests/misc/compositing-transforms.html.
+ * Animometer/tests/dom/resources/compositing-transforms.js: Renamed from PerformanceTests/Animometer/tests/misc/resources/compositing-transforms.js.
+
+ Clean up miscellaneous test suite. Add a canvas ellipse test, and remove the other
+ canvas tests.
+
+ * Animometer/resources/debug-runner/tests.js: Add ellipse tests to the simple suite.
+ * Animometer/tests/misc/canvas-electrons.html: Removed.
+ * Animometer/tests/misc/canvas-stars.html: Removed.
+ * Animometer/tests/misc/resources/canvas-electrons.js: Removed.
+ * Animometer/tests/misc/resources/canvas-stars.js: Removed.
+ * Animometer/tests/simple/resources/simple-canvas-paths.js: Add ellipse primitives.
+
+ Merge text tests together into one.
+
+ * Animometer/resources/runner/tests.js: Remove international.html.
+ * Animometer/tests/master/international.html: Removed.
+ * Animometer/tests/master/resources/text.js:
+ (animate): Update styling. Manually calculate gradients for the shadow particles.
+ Reduce the step size for y direction to avoid cutting text off at the margins. Increase
+ step for x since there will be a little more room.
+ * Animometer/tests/master/text.html: Add more translations and lay it out in a table.
+
2016-03-20 Jon Lee <jon...@apple.com>
Add a link to show debug data
