diff options
Diffstat (limited to 'testing/talos/talos/tests/gfx')
4 files changed, 268 insertions, 0 deletions
diff --git a/testing/talos/talos/tests/gfx/benchmarks/rasterflood_gradient.html b/testing/talos/talos/tests/gfx/benchmarks/rasterflood_gradient.html new file mode 100644 index 0000000000..569077dcde --- /dev/null +++ b/testing/talos/talos/tests/gfx/benchmarks/rasterflood_gradient.html @@ -0,0 +1,120 @@ +<!DOCTYPE html> +<html> +<head> + <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/> + <title>Paint-In-Time 2</title> + <style> + .gradient { + position: absolute; + width: 800px; + height: 600px; + opacity: 0.4; + } + </style> +</head> +<body> + <div id="grid"> + </div> +</body> +<script> + +// Only allow painting a tiny slice of the frame - here, 15ms. +var kFrameBudgetMs = 14; +var kDivCount = 10; +var kMaxTime = 20 * 1000; + +var gCrazyCounter = 0; +var gIterations = 0; +var gStart; +var gDivs = []; + +function GetColor() { + var color = GetColor.kColors[GetColor.Index]; + GetColor.Index++; + GetColor.Index = (GetColor.Index % GetColor.kColors.length); + return color; +} +GetColor.Index = 0; +GetColor.kColors = ["red", "white", "green", "yellow", "orange", "brown"]; + +function RadialGradient(offset) { + this.colors = [GetColor(), GetColor()]; + this.percents = [0 + offset, 20 + offset]; + this.toStyle = function() { + return "radial-gradient(" + + this.colors[0] + " " + this.percents[0] + "%, " + + this.colors[1] + " " + this.percents[1] + "%)"; + }; + this.advance = function() { + this.percents[0] += 1; + this.percents[0] %= 80; + this.percents[1] = this.percents[0] + 20; + }; +} + +function runFrame() { + var start = performance.now(); + + // Spin loop. + while (performance.now() - start < kFrameBudgetMs) + gCrazyCounter++; + + for (var i = 0; i < gDivs.length; i++) { + var info = gDivs[i]; + info.gradient.advance(); + info.element.style.background = info.gradient.toStyle(); + } + + gIterations++; + + if (performance.now() - gStart >= kMaxTime) { + if (window.tpRecordTime) { + window.tpRecordTime(gIterations); + } + return; + } + + TalosContentProfiler.mark("rasterflood_gradient", true, start); + + window.requestAnimationFrame(runFrame); +} + +function setup() { + var root = document.getElementById("grid"); + for (var i = 0; i < kDivCount; i++) { + var gradient = new RadialGradient(i * 10 / 2); + + var div = document.createElement("div"); + var info = {}; + info.element = div; + info.gradient = gradient; + + div.classList.add("gradient"); + div.style.left = "10px"; + div.style.top = "10px"; + div.style.background = gradient.toStyle(); + root.appendChild(div); + + gDivs.push(info); + } +} + +function startTest() { + setup(); + gStart = performance.now(); + window.requestAnimationFrame(runFrame); +} + +addEventListener("load", function() { + try { + TalosContentProfiler.resume("rasterflood_gradient.html loaded", true).then(() => { + startTest(); + }); + } catch (e) { + TalosContentProfiler.resume("rasterflood_gradient.html loaded", true); + startTest(); + } +}); +</script> +<script type="text/javascript" src="resource://talos-powers/TalosContentProfiler.js"></script> +</html> diff --git a/testing/talos/talos/tests/gfx/benchmarks/rasterflood_svg.html b/testing/talos/talos/tests/gfx/benchmarks/rasterflood_svg.html new file mode 100644 index 0000000000..39b50938c7 --- /dev/null +++ b/testing/talos/talos/tests/gfx/benchmarks/rasterflood_svg.html @@ -0,0 +1,146 @@ +<!DOCTYPE html> +<html><head> + <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> + <title>Paint-In-Time</title> + <style> + svg { + width: 600px; + height: 800px; + } + </style> +</head> +<body> + <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xlink="http://www.w3.org/1999/xlink"> + <defs> + <filter id="filter1"> + <feGaussianBlur stdDeviation=".5"></feGaussianBlur> + </filter> + <filter id="filter2"> + <feGaussianBlur in="SourceAlpha" stdDeviation="4" result="blur1"></feGaussianBlur> + <feSpecularLighting result="specOut" in="blur1" specularExponent="20" lighting-color="#cccccc"> + <fePointLight x="50" y="50" z="1"></fePointLight> + </feSpecularLighting> + <feComposite in="SourceGraphic" in2="specOut" operator="arithmetic" k1="0" k2="1" k3="1" k4="0"></feComposite> + </filter> + </defs> + <g fill="none" stroke="blue" stroke-width="20" stroke-dasharray="1" class="rotating"> + <rect x="50" y="50" width="80px" height="80px" fill="blue" id="rect1" opacity="0.25" filter="url(#filter2)" transform="rotate(202 64 64)"> + </rect> + </g> + <g fill="none" stroke="red" stroke-width="20" lass="rotating"> + <rect x="75" y="75" width="80px" height="80px" fill="blue" id="rect2" opacity="0.5" filter="url(#filter1)" transform="rotate(202 89 89)"> + </rect> + </g> + <g fill="none" stroke="green" stroke-width="20" class="rotating"> + <rect x="100" y="100" width="80px" height="80px" fill="green" id="rect3" opacity="0.75" filter="url(#filter1)" transform="rotate(202 114 114)"> + </rect> + </g> + <g fill="none" stroke="yellow" stroke-width="20" stroke-dasharray="1" class="rotating"> + <rect x="125" y="125" width="80px" height="80px" fill="green" id="rect4" opacity="1" filter="url(#filter2)" transform="rotate(202 139 139)"> + </rect> + </g> + <g fill="none" stroke="pink" stroke-width="20" stroke-dasharray="1" class="rotating"> + <rect x="75" y="125" width="80px" height="80px" fill="green" id="rect5" opacity="1" filter="url(#filter2)" transform="rotate(202 89 139)"> + </rect> + </g> + </svg> + +<script> + +// Only allow painting a tiny slice of the frame - here, 15ms. +var kFrameBudgetMs = 14; +var kDegPerFrame = 1; +var kCurrentRotation = 0; +var kMaxIterations = 600; +var kMinSize = 80; +var kMaxSize = 200; +var kOpacityPerFrame = [0.05, 0.05, 0.05, 0.05, 0.05, 0.05, 0.05]; + +var gCrazyCounter = 0; +var gStart; +var gSizeChangePerFrame = 1; +var gCurrentSize = 50; +var gIterations = 0; + +function runFrame() { + var start = performance.now(); + + // Spin loop. + while (performance.now() - start < kFrameBudgetMs) + gCrazyCounter++; + + // Change rotation. + var elts = [ + document.getElementById("rect1"), + document.getElementById("rect2"), + document.getElementById("rect3"), + document.getElementById("rect4"), + document.getElementById("rect5"), + ]; + + kCurrentRotation = (kCurrentRotation + kDegPerFrame) % 360; + + // Change size. + if (gCurrentSize >= kMaxSize) + gSizeChangePerFrame = -1; + else if (gCurrentSize <= kMinSize) + gSizeChangePerFrame = 1; + gCurrentSize += gSizeChangePerFrame; + + for (var i = 0; i < elts.length; i++) { + var elt = elts[i]; + + elt.setAttribute("height", gCurrentSize + "px"); + elt.setAttribute("width", gCurrentSize + "px"); + + var bb = elt.getBBox(); + var x = bb.x + bb.width / 2; + var y = bb.y + bb.height / 2; + var origin = x + " " + y; + elt.setAttribute("transform", "rotate(" + kCurrentRotation + " " + origin + ")"); + + var opacity = parseFloat(window.getComputedStyle(elt).getPropertyValue("opacity")); + if (opacity + kOpacityPerFrame[i] >= 1.0) { + opacity = 1.0; + kOpacityPerFrame[i] = -kOpacityPerFrame[i]; + } else if (opacity + kOpacityPerFrame[i] < 0.1) { + opacity = 1.0; + kOpacityPerFrame[i] = -kOpacityPerFrame[i]; + } + elt.setAttribute("opacity", opacity); + } + + if (gIterations >= kMaxIterations) { + var end = performance.now(); + if (window.tpRecordTime) { + window.tpRecordTime(end - gStart, gStart); + } + if (parent.reportResults) { + parent.reportResults(end - gStart, gStart); + } + return; + } + + window.requestAnimationFrame(runFrame); + gIterations++; + TalosContentProfiler.mark("rasterflood svg", gStart); +} + +function startTest() { + gStart = performance.now(); + window.requestAnimationFrame(runFrame); +} + +addEventListener("load", function() { + try { + TalosContentProfiler.resume("rasterflood_svg.html loaded", true).then(() => { + startTest(); + }); + } catch (e) { + startTest(); + } +}); +</script> +<script type="text/javascript" src="resource://talos-powers/TalosContentProfiler.js"></script> + +</body></html> diff --git a/testing/talos/talos/tests/gfx/rasterflood_gradient.manifest b/testing/talos/talos/tests/gfx/rasterflood_gradient.manifest new file mode 100644 index 0000000000..2351c5653f --- /dev/null +++ b/testing/talos/talos/tests/gfx/rasterflood_gradient.manifest @@ -0,0 +1 @@ +% http://localhost/tests/gfx/benchmarks/rasterflood_gradient.html diff --git a/testing/talos/talos/tests/gfx/rasterflood_svg.manifest b/testing/talos/talos/tests/gfx/rasterflood_svg.manifest new file mode 100644 index 0000000000..9398300b86 --- /dev/null +++ b/testing/talos/talos/tests/gfx/rasterflood_svg.manifest @@ -0,0 +1 @@ +% http://localhost/tests/gfx/benchmarks/rasterflood_svg.html |