Add canvas to canvas perf test

With deferral enabled we can get a lot of resource thrash when intermediate canvases and contexts are created, updated and drawn to a target canvas multiple times in a tight loop. Add a perf test for this. Bug: 1049491 Change-Id: I360ed39a36027bd6efafddee5582a64b90eb3ae7 Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2053727Reviewed-by: Khushal <khushalsagar@chromium.org> Reviewed-by: Aaron Krajeski <aaronhk@chromium.org> Reviewed-by: Fernando Serboncini <fserb@chromium.org> Commit-Queue: Aaron Krajeski <aaronhk@chromium.org> Cr-Commit-Position: refs/heads/master@{#741517}

Add canvas to canvas perf test
With deferral enabled we can get a lot of resource thrash when intermediate canvases and contexts are created, updated and drawn to a target canvas multiple times in a tight loop. Add a perf test for this. Bug: 1049491 Change-Id: I360ed39a36027bd6efafddee5582a64b90eb3ae7 Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2053727Reviewed-by: Khushal <khushalsagar@chromium.org> Reviewed-by: Aaron Krajeski <aaronhk@chromium.org> Reviewed-by: Fernando Serboncini <fserb@chromium.org> Commit-Queue: Aaron Krajeski <aaronhk@chromium.org> Cr-Commit-Position: refs/heads/master@{#741517}
a156973a · Aaron Krajeski · Commit Bot · ff6a3597 · a156973a
Commit a156973a authored Feb 14, 2020 by Aaron Krajeski Committed by Commit Bot Feb 14, 2020
Hide whitespace changes
Inline Side-by-side

Showing with 54 additions and 0 deletions

third_party/blink/perf_tests/canvas/canvas-to-canvas-draw.html ..._party/blink/perf_tests/canvas/canvas-to-canvas-draw.html +54 -0

No files found.
--- a/third_party/blink/perf_tests/canvas/canvas-to-canvas-draw.html
+++ b/third_party/blink/perf_tests/canvas/canvas-to-canvas-draw.html
+<!DOCTYPE html>
+<html>
+<body>
+<script src="../resources/runner.js"></script>
+<script src="resources/canvas_runner.js"></script>
+<script>
+// With deferral enabled we can get a lot of resource thrash when intermediate
+// canvases and contexts are created, updated and drawn to a target canvas
+// multiple times in a tight loop.
+// See crbug.com/1030108
+// We're more likely to see regressions with large canvases
+const size = 1024;
+const targetCanvas = document.createElement("canvas");
+targetCanvas.width = targetCanvas.height = size;
+document.body.appendChild(targetCanvas);
+const targetCtx = targetCanvas.getContext("2d");
+const intermediateCanvas = document.createElement("canvas");
+intermediateCanvas.width = intermediateCanvas.height = size;
+const intermediateCtx = intermediateCanvas.getContext("2d");
+function rand(range) {
+  return Math.floor(Math.random() * range);
+}
+function randomColor() {
+  return "rgba(" + rand(255) + "," + rand(255) + "," + rand(255)  + "," + rand(255) + ")";
+}
+function makeAndFillCanvasWithRandomColor(i) {
+  intermediateCtx.fillStyle = randomColor();
+  intermediateCtx.fillRect(0, 0, intermediateCanvas.width, intermediateCanvas.height);
+  targetCtx.drawImage(intermediateCanvas, 0, 0);
+}
+function doRun() {
+  // Make and fill many canvases
+  for (let i = 0; i < 50; i++) {
+    makeAndFillCanvasWithRandomColor(i);
+  }
+}
+window.onload = function () {
+  CanvasRunner.start({
+    description: "This benchmark tests the performance of creating many intermediate canvases and drawing them onto a target canvas in a tight loop",
+    doRun: doRun});
+}
+</script>
+</body>
+</html>
\ No newline at end of file