diff options
author | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-19 00:47:55 +0000 |
---|---|---|
committer | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-19 00:47:55 +0000 |
commit | 26a029d407be480d791972afb5975cf62c9360a6 (patch) | |
tree | f435a8308119effd964b339f76abb83a57c29483 /third_party/webkit/PerformanceTests/MotionMark/tests/simple | |
parent | Initial commit. (diff) | |
download | firefox-26a029d407be480d791972afb5975cf62c9360a6.tar.xz firefox-26a029d407be480d791972afb5975cf62c9360a6.zip |
Adding upstream version 124.0.1.upstream/124.0.1
Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
Diffstat (limited to 'third_party/webkit/PerformanceTests/MotionMark/tests/simple')
5 files changed, 641 insertions, 0 deletions
diff --git a/third_party/webkit/PerformanceTests/MotionMark/tests/simple/resources/simple-canvas-paths.js b/third_party/webkit/PerformanceTests/MotionMark/tests/simple/resources/simple-canvas-paths.js new file mode 100644 index 0000000000..cda985b221 --- /dev/null +++ b/third_party/webkit/PerformanceTests/MotionMark/tests/simple/resources/simple-canvas-paths.js @@ -0,0 +1,453 @@ +(function() { + +// === PAINT OBJECTS === + +CanvasLineSegment = Utilities.createClass( + function(stage) { + var radius = Stage.randomInt(10, 100); + var center = Stage.randomPosition(stage.size); + var delta = Point.pointOnCircle(Stage.randomAngle(), radius/2); + + this._point1 = center.add(delta); + this._point2 = center.subtract(delta); + this._color = Stage.randomColor(); + this._lineWidth = Stage.randomInt(1, 100); + }, { + + draw: function(context) { + context.strokeStyle = this._color; + context.lineWidth = this._lineWidth; + context.beginPath(); + context.moveTo(this._point1.x, this._point1.y); + context.lineTo(this._point2.x, this._point2.y); + context.stroke(); + } +}); + +CanvasLinePoint = Utilities.createClass( + function(stage, coordinateMaximumFactor) { + var pointMaximum = new Point(Math.min(stage.size.x, coordinateMaximumFactor * stage.size.x), Math.min(stage.size.y, coordinateMaximumFactor * stage.size.y)); + this._point = Stage.randomPosition(pointMaximum).add(new Point((stage.size.x - pointMaximum.x) / 2, (stage.size.y - pointMaximum.y) / 2)); + }, { + + draw: function(context) { + context.lineTo(this._point.x, this._point.y); + } +}) + +CanvasQuadraticSegment = Utilities.createClass( + function(stage) { + var maxSize = Stage.randomInt(20, 200); + var toCenter = Stage.randomPosition(stage.size).subtract(new Point(maxSize/2, maxSize/2)); + + this._point1 = Stage.randomPosition(new Point(maxSize, maxSize)).add(toCenter); + this._point2 = Stage.randomPosition(new Point(maxSize, maxSize)).add(toCenter); + this._point3 = Stage.randomPosition(new Point(maxSize, maxSize)).add(toCenter); + this._color = Stage.randomColor(); + this._lineWidth = Stage.randomInt(1, 50); + }, { + + draw: function(context) { + context.strokeStyle = this._color; + context.lineWidth = this._lineWidth; + context.beginPath(); + context.moveTo(this._point1.x, this._point1.y); + context.quadraticCurveTo(this._point2.x, this._point2.y, this._point3.x, this._point3.y); + context.stroke(); + } +}); + +CanvasQuadraticPoint = Utilities.createClass( + function(stage, coordinateMaximumFactor) { + var pointMaximum = Stage.randomPosition(new Point(Math.min(stage.size.x, coordinateMaximumFactor * stage.size.x), Math.min(stage.size.y, coordinateMaximumFactor * stage.size.y))); + this._point1 = Stage.randomPosition(pointMaximum).add(new Point((stage.size.x - pointMaximum.x) / 2, (stage.size.y - pointMaximum.y) / 2)); + this._point2 = Stage.randomPosition(pointMaximum).add(new Point((stage.size.x - pointMaximum.x) / 2, (stage.size.y - pointMaximum.y) / 2)); + }, { + + draw: function(context) { + context.quadraticCurveTo(this._point1.x, this._point1.y, this._point2.x, this._point2.y); + } +}); + +CanvasBezierSegment = Utilities.createClass( + function(stage) { + var maxSize = Stage.randomInt(20, 200); + var toCenter = Stage.randomPosition(stage.size).subtract(new Point(maxSize/2, maxSize/2)); + + this._point1 = Stage.randomPosition(new Point(maxSize, maxSize)).add(toCenter); + this._point2 = Stage.randomPosition(new Point(maxSize, maxSize)).add(toCenter); + this._point3 = Stage.randomPosition(new Point(maxSize, maxSize)).add(toCenter); + this._point4 = Stage.randomPosition(new Point(maxSize, maxSize)).add(toCenter); + this._color = Stage.randomColor(); + this._lineWidth = Stage.randomInt(1, 50); + }, { + + draw: function(context) { + context.strokeStyle = this._color; + context.lineWidth = this._lineWidth; + context.beginPath(); + context.moveTo(this._point1.x, this._point1.y); + context.bezierCurveTo(this._point2.x, this._point2.y, this._point3.x, this._point3.y, this._point4.x, this._point4.y); + context.stroke(); + } +}); + +CanvasBezierPoint = Utilities.createClass( + function(stage, coordinateMaximumFactor) { + var pointMaximum = Stage.randomPosition(new Point(Math.min(stage.size.x, coordinateMaximumFactor * stage.size.x), Math.min(stage.size.y, coordinateMaximumFactor * stage.size.y))); + this._point1 = Stage.randomPosition(pointMaximum).add(new Point((stage.size.x - pointMaximum.x) / 2, (stage.size.y - pointMaximum.y) / 2)); + this._point2 = Stage.randomPosition(pointMaximum).add(new Point((stage.size.x - pointMaximum.x) / 2, (stage.size.y - pointMaximum.y) / 2)); + this._point3 = Stage.randomPosition(pointMaximum).add(new Point((stage.size.x - pointMaximum.x) / 2, (stage.size.y - pointMaximum.y) / 2)); + }, { + + draw: function(context) { + context.bezierCurveTo(this._point1.x, this._point1.y, this._point2.x, this._point2.y, this._point3.x, this._point3.y); + } +}); + +CanvasArcToSegment = Utilities.createClass( + function(stage) { + var maxSize = Stage.randomInt(20, 200); + var toCenter = Stage.randomPosition(stage.size).subtract(new Point(maxSize/2, maxSize/2)); + + this._point1 = Stage.randomPosition(new Point(maxSize, maxSize)).add(toCenter); + this._point2 = Stage.randomPosition(new Point(maxSize, maxSize)).add(toCenter); + this._point3 = Stage.randomPosition(new Point(maxSize, maxSize)).add(toCenter); + this._radius = Stage.randomInt(20, 200); + this._color = Stage.randomColor(); + this._lineWidth = Stage.randomInt(1, 50); + }, { + + draw: function(context) { + context.strokeStyle = this._color; + context.lineWidth = this._lineWidth; + context.beginPath(); + context.moveTo(this._point1.x, this._point1.y); + context.arcTo(this._point2.x, this._point2.y, this._point3.x, this._point3.y, this._radius); + context.stroke(); + } +}); + +CanvasArcToSegmentFill = Utilities.createClass( + function(stage) { + CanvasArcToSegment.call(this, stage); + }, { + + draw: function(context) { + context.fillStyle = this._color; + context.beginPath(); + context.moveTo(this._point1.x, this._point1.y); + context.arcTo(this._point2.x, this._point2.y, this._point3.x, this._point3.y, this._radius); + context.fill(); + } +}); + +CanvasArcSegment = Utilities.createClass( + function(stage) { + var maxSize = Stage.randomInt(20, 200); + var toCenter = Stage.randomPosition(stage.size).subtract(new Point(maxSize/2, maxSize/2)); + + this._point = Stage.randomPosition(new Point(maxSize, maxSize)).add(toCenter); + this._radius = Stage.randomInt(20, 200); + this._startAngle = Stage.randomAngle(); + this._endAngle = Stage.randomAngle(); + this._counterclockwise = Stage.randomBool(); + this._color = Stage.randomColor(); + this._lineWidth = Stage.randomInt(1, 50); + }, { + + draw: function(context) { + context.strokeStyle = this._color; + context.lineWidth = this._lineWidth; + context.beginPath(); + context.arc(this._point.x, this._point.y, this._radius, this._startAngle, this._endAngle, this._counterclockwise); + context.stroke(); + } +}); + +CanvasArcSegmentFill = Utilities.createClass( + function(stage) { + CanvasArcSegment.call(this, stage); + }, { + + draw: function(context) { + context.fillStyle = this._color; + context.beginPath(); + context.arc(this._point.x, this._point.y, this._radius, this._startAngle, this._endAngle, this._counterclockwise); + context.fill(); + } +}); + +CanvasRect = Utilities.createClass( + function(stage) { + this._width = Stage.randomInt(20, 200); + this._height = Stage.randomInt(20, 200); + this._point = Stage.randomPosition(stage.size).subtract(new Point(this._width/2, this._height/2)); + this._color = Stage.randomColor(); + this._lineWidth = Stage.randomInt(1, 20); + }, { + + draw: function(context) { + context.strokeStyle = this._color; + context.lineWidth = this._lineWidth; + context.beginPath(); + context.rect(this._point.x, this._point.y, this._width, this._height); + context.stroke(); + } +}); + +CanvasRectFill = Utilities.createClass( + function(stage) { + CanvasRect.call(this, stage); + }, { + + draw: function(context) { + context.fillStyle = this._color; + context.beginPath(); + context.rect(this._point.x, this._point.y, this._width, this._height); + context.fill(); + } +}); + +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, + function(canvasObject) { + SimpleCanvasStage.call(this, canvasObject); + }, { + + animate: function() + { + var context = this.context; + context.clearRect(0, 0, this.size.x, this.size.y); + context.lineWidth = Stage.randomInt(1, 20); + context.strokeStyle = Stage.rotatingColor(); + context.beginPath(); + context.moveTo(this.size.x / 2, this.size.y / 2); + for (var i = 0, length = this.offsetIndex; i < length; ++i) + this.objects[i].draw(context); + context.stroke(); + } +}); + +SimpleCanvasPathFillStage = Utilities.createSubclass(SimpleCanvasStage, + function(canvasObject) { + SimpleCanvasStage.call(this, canvasObject); + }, { + + animate: function() + { + var context = this.context; + context.clearRect(0, 0, this.size.x, this.size.y); + context.fillStyle = Stage.rotatingColor(); + context.beginPath(); + context.moveTo(this.size.x / 2, this.size.y / 2); + for (var i = 0, length = this.offsetIndex; i < length; ++i) + this.objects[i].draw(context); + context.fill(); + } +}); + +CanvasLineSegmentStage = Utilities.createSubclass(SimpleCanvasStage, + function() + { + SimpleCanvasStage.call(this, CanvasLineSegment); + }, { + + initialize: function(benchmark, options) + { + SimpleCanvasStage.prototype.initialize.call(this, benchmark, options); + this.context.lineCap = options["lineCap"] || "butt"; + } +}); + +CanvasLinePathStage = Utilities.createSubclass(SimpleCanvasPathStrokeStage, + function() + { + SimpleCanvasPathStrokeStage.call(this, CanvasLinePoint); + }, { + + initialize: function(benchmark, options) + { + SimpleCanvasPathStrokeStage.prototype.initialize.call(this, benchmark, options); + this.context.lineJoin = options["lineJoin"] || "bevel"; + } +}); + +CanvasLineDashStage = Utilities.createSubclass(SimpleCanvasStage, + function() + { + SimpleCanvasStage.call(this, CanvasLinePoint); + this._step = 0; + }, { + + initialize: function(benchmark, options) + { + SimpleCanvasStage.prototype.initialize.call(this, benchmark, options); + this.context.setLineDash([1, 2, 3, 4, 5, 6, 7, 8, 9, 10]); + this.context.lineWidth = 1; + this.context.strokeStyle = "#000"; + }, + + animate: function() + { + var context = this.context; + context.clearRect(0, 0, this.size.x, this.size.y); + context.lineDashOffset = this._step++; + context.beginPath(); + context.moveTo(this.size.x / 2, this.size.y / 2); + for (var i = 0, length = this.offsetIndex; i < length; ++i) + this.objects[i].draw(context); + context.stroke(); + } +}); + +// === BENCHMARK === + +CanvasPathBenchmark = Utilities.createSubclass(Benchmark, + function(options) + { + var stage; + switch (options["pathType"]) { + case "line": + stage = new CanvasLineSegmentStage(); + break; + case "linePath": { + if ("lineJoin" in options) + stage = new CanvasLinePathStage(); + if ("lineDash" in options) + stage = new CanvasLineDashStage(); + break; + } + case "quadratic": + stage = new SimpleCanvasStage(CanvasQuadraticSegment); + break; + case "quadraticPath": + stage = new SimpleCanvasPathStrokeStage(CanvasQuadraticPoint); + break; + case "bezier": + stage = new SimpleCanvasStage(CanvasBezierSegment); + break; + case "bezierPath": + stage = new SimpleCanvasPathStrokeStage(CanvasBezierPoint); + break; + case "arcTo": + stage = new SimpleCanvasStage(CanvasArcToSegment); + break; + case "arc": + stage = new SimpleCanvasStage(CanvasArcSegment); + break; + case "rect": + stage = new SimpleCanvasStage(CanvasRect); + break; + case "ellipse": + stage = new SimpleCanvasStage(CanvasEllipse); + break; + case "lineFill": + stage = new SimpleCanvasPathFillStage(CanvasLinePoint); + break; + case "quadraticFill": + stage = new SimpleCanvasPathFillStage(CanvasQuadraticPoint); + break; + case "bezierFill": + stage = new SimpleCanvasPathFillStage(CanvasBezierPoint); + break; + case "arcToFill": + stage = new SimpleCanvasStage(CanvasArcToSegmentFill); + break; + case "arcFill": + stage = new SimpleCanvasStage(CanvasArcSegmentFill); + break; + 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); + } +); + +window.benchmarkClass = CanvasPathBenchmark; + +})();
\ No newline at end of file diff --git a/third_party/webkit/PerformanceTests/MotionMark/tests/simple/resources/simple-canvas.js b/third_party/webkit/PerformanceTests/MotionMark/tests/simple/resources/simple-canvas.js new file mode 100644 index 0000000000..483d535d75 --- /dev/null +++ b/third_party/webkit/PerformanceTests/MotionMark/tests/simple/resources/simple-canvas.js @@ -0,0 +1,35 @@ +Utilities.extendObject(SimpleCanvasStage.prototype, { + tune: function(count) + { + if (count == 0) + return; + + if (count < 0) { + this.offsetIndex = Math.max(this.offsetIndex + count, 0); + return; + } + + this.offsetIndex = this.offsetIndex + count; + if (this.offsetIndex > this.objects.length) { + // For some tests, it may be easier to see how well the test is going + // by limiting the range of coordinates in which new objects can reside + var coordinateMaximumFactor = Math.min(this.objects.length, Math.min(this.size.x, this.size.y)) / Math.min(this.size.x, this.size.y); + var newIndex = this.offsetIndex - this.objects.length; + for (var i = 0; i < newIndex; ++i) + this.objects.push(new this._canvasObject(this, coordinateMaximumFactor)); + } + }, + + animate: function() + { + var context = this.context; + context.clearRect(0, 0, this.size.x, this.size.y); + for (var i = 0, length = this.offsetIndex; i < length; ++i) + this.objects[i].draw(context); + }, + + complexity: function() + { + return this.offsetIndex; + } +}); diff --git a/third_party/webkit/PerformanceTests/MotionMark/tests/simple/resources/tiled-canvas-image.js b/third_party/webkit/PerformanceTests/MotionMark/tests/simple/resources/tiled-canvas-image.js new file mode 100644 index 0000000000..f5d02b68a4 --- /dev/null +++ b/third_party/webkit/PerformanceTests/MotionMark/tests/simple/resources/tiled-canvas-image.js @@ -0,0 +1,119 @@ +(function() { + +CanvasImageTile = Utilities.createClass( + function(stage, source) + { + this._context = stage.context; + this._size = stage.tileSize; + this.source = source; + }, { + + getImageData: function() + { + this._imagedata = this._context.getImageData(this.source.x, this.source.y, this._size.width, this._size.height); + }, + + putImageData: function(destination) + { + this._context.putImageData(this._imagedata, destination.x, destination.y); + } +}); + +TiledCanvasImageStage = Utilities.createSubclass(Stage, + function(element, options) + { + Stage.call(this); + }, { + + initialize: function(benchmark, options) + { + Stage.prototype.initialize.call(this, benchmark, options); + this.context = this.element.getContext("2d"); + this._setupTiles(); + }, + + _setupTiles: function() + { + const maxTilesPerRow = 50; + const maxTilesPerCol = 50; + + this.tileSize = this.size.multiply(new Point(1 / maxTilesPerRow, 1 / maxTilesPerCol)); + + this._tiles = new Array(maxTilesPerRow * maxTilesPerCol); + + var source = Point.zero; + for (var index = 0; index < this._tiles.length; ++index) { + this._tiles[index] = new CanvasImageTile(this, source); + source = this._nextTilePosition(source); + } + + this._ctiles = 0; + }, + + _nextTilePosition: function(destination) + { + var next = destination.add(this.tileSize); + + if (next.x >= this._size.width) + return new Point(0, next.y >= this._size.height ? 0 : next.y); + + return new Point(next.x, destination.y); + }, + + tune: function(count) + { + this._ctiles += count; + + this._ctiles = Math.max(this._ctiles, 0); + this._ctiles = Math.min(this._ctiles, this._tiles.length); + }, + + _drawBackground: function() + { + var size = this._benchmark._stage.size; + var gradient = this.context.createLinearGradient(0, 0, size.width, 0); + gradient.addColorStop(0, "red"); + gradient.addColorStop(1, "white"); + this.context.save(); + this.context.fillStyle = gradient; + this.context.fillRect(0, 0, size.width, size.height); + this.context.restore(); + }, + + animate: function(timeDelta) + { + this._drawBackground(); + + if (!this._ctiles) + return; + + this._tiles.shuffle(); + + var destinations = new Array(this._ctiles); + for (var index = 0; index < this._ctiles; ++index) { + this._tiles[index].getImageData(); + destinations[index] = this._tiles[index].source; + } + + destinations.shuffle(); + + for (var index = 0; index < this._ctiles; ++index) + this._tiles[index].putImageData(destinations[index]); + }, + + complexity: function() + { + return this._ctiles; + } +}); + +TiledCanvasImageBenchmark = Utilities.createSubclass(Benchmark, + function(options) + { + Benchmark.call(this, new TiledCanvasImageStage(), options); + } +); + +window.benchmarkClass = TiledCanvasImageBenchmark; + +})(); diff --git a/third_party/webkit/PerformanceTests/MotionMark/tests/simple/simple-canvas-paths.html b/third_party/webkit/PerformanceTests/MotionMark/tests/simple/simple-canvas-paths.html new file mode 100644 index 0000000000..5bb69bc54f --- /dev/null +++ b/third_party/webkit/PerformanceTests/MotionMark/tests/simple/simple-canvas-paths.html @@ -0,0 +1,18 @@ +<!DOCTYPE html> +<html> +<head> + <meta charset="utf-8"> + <link rel="stylesheet" type="text/css" href="../resources/stage.css"> +</head> +<body> + <canvas id="stage"></canvas> + <script src="../../resources/strings.js"></script> + <script src="../../resources/extensions.js"></script> + <script src="../../resources/statistics.js"></script> + <script src="../resources/math.js"></script> + <script src="../resources/main.js"></script> + <script src="../master/resources/canvas-stage.js"></script> + <script src="resources/simple-canvas.js"></script> + <script src="resources/simple-canvas-paths.js"></script> +</body> +</html> diff --git a/third_party/webkit/PerformanceTests/MotionMark/tests/simple/tiled-canvas-image.html b/third_party/webkit/PerformanceTests/MotionMark/tests/simple/tiled-canvas-image.html new file mode 100644 index 0000000000..c7c0fef774 --- /dev/null +++ b/third_party/webkit/PerformanceTests/MotionMark/tests/simple/tiled-canvas-image.html @@ -0,0 +1,16 @@ +<!DOCTYPE html> +<html> +<head> + <meta charset="utf-8"> + <link rel="stylesheet" type="text/css" href="../resources/stage.css"> +</head> +<body> + <canvas id="stage"></canvas> + <script src="../../resources/strings.js"></script> + <script src="../../resources/extensions.js"></script> + <script src="../../resources/statistics.js"></script> + <script src="../resources/math.js"></script> + <script src="../resources/main.js"></script> + <script src="resources/tiled-canvas-image.js"></script> +</body> +</html> |