PerformanceTests/Animation/api-balls-keyframe-animations-small.html - Issue 299073003: Web Animations API: Avoid style resolution when calling element.animate()

Unified Diff: PerformanceTests/Animation/api-balls-keyframe-animations-small.html

Issue 299073003: Web Animations API: Avoid style resolution when calling element.animate() (Closed) Base URL: https://chromium.googlesource.com/chromium/blink.git@master

Patch Set: Rename test to api-balls-keyframe-animations.html Created 6 years, 7 months ago

Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.

Jump to:

View side-by-side diff with in-line comments

Download patch

« no previous file with comments | « PerformanceTests/Animation/api-balls-keyframe-animations.html ('k') | Source/core/animation/EffectInput.cpp » ('j') | Source/core/animation/EffectInput.cpp » ('J')
Expand Comments ('e') | Collapse Comments ('c') | Hide Comments ('s')

Index: PerformanceTests/Animation/api-balls-keyframe-animations-small.html

diff --git a/PerformanceTests/Animation/api-balls-keyframe-animations-small.html b/PerformanceTests/Animation/api-balls-keyframe-animations-small.html

deleted file mode 100644

index 3dc3195320092d46aa3721f792eb972f1d96ceeb..0000000000000000000000000000000000000000

--- a/PerformanceTests/Animation/api-balls-keyframe-animations-small.html

+++ /dev/null

@@ -1,177 +0,0 @@

-<!--

-Redistribution and use in source and binary forms, with or without

-modification, are permitted provided that the following conditions are

-met:

- * Redistributions of source code must retain the above copyright

-notice, this list of conditions and the following disclaimer.

- * Redistributions in binary form must reproduce the above

-copyright notice, this list of conditions and the following disclaimer

-in the documentation and/or other materials provided with the

-distribution.

- * Neither the name of Code Aurora Forum Inc., Google Inc. nor the

-names of its contributors may be used to endorse or promote products

-derived from this software without specific prior written permission.

-THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS

-"AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT

-LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR

-A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT

-OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,

-SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT

-LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,

-DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY

-THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT

-(INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE

-OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.

-This test is based on code written by Cameron Adams and imported from

- http://themaninblue.com/experiment/AnimationBenchmark/html

--->

-<!doctype html>

-<head>

-<title>Benchmark - Balls Animation using CSS Animations</title>

-<style>

-html {

- height: 100%;

-body {

- width: 100%;

- height: 100%;

- overflow: hidden;

- margin: 0;

- padding: 0;

-span {

- position: absolute;

- width: 12px;

- height: 12px;

- border-radius: 6px;

-</style>

-<script src="../resources/runner.js"></script>

-<script src="resources/framerate.js"></script>

-<script>

-var stageWidth = 600;

-var stageHeight = 600;

-var maxParticles = 500;

-var minVelocity = 50;

-var maxVelocity = 500;

-var particleRadius = 6;

-var colors = ["#cc0000", "#ffcc00", "#aaff00", "#0099cc", "#194c99", "#661999"];

-var animationDuration = 10;

-var particles = [];

-var allParticleKeyframes = [];

-window.onload = function () {

- PerfTestRunner.prepareToMeasureValuesAsync({done: onCompletedRun, unit: 'fps'});

- // Create the particles

- for (var i = 0; i < maxParticles; i++) {

- generateParticleKeyframes(i);

- var particle = new Particle(i);

- particles.push(particle);

- }

- for (var i = 0; i < maxParticles; i++)

- particles[i].start();

- startTrackingFrameRate();

-function generateParticleKeyframes(index) {

- allParticleKeyframes[index] = [];

- var angle = Math.PI * 2 * PerfTestRunner.random();

- var velocity = minVelocity + ((maxVelocity - minVelocity) * PerfTestRunner.random());

- var x = stageWidth / 2 - particleRadius;

- var y = stageHeight / 2 - particleRadius;

- var dx = Math.cos(angle) * velocity;

- var dy = Math.sin(angle) * velocity;

- function detectCollision(lineX, normalX, lineY, normalY) {

- var dtx = Infinity;

- var dty = Infinity;

- if (dx * normalX < 0)

- dtx = (lineX - x) / dx;

- if (dy * normalY < 0)

- dty = (lineY - y) / dy;

- var dt = Math.min(dtx, dty);

- var hitX = (dtx < dty);

- return {

- dt: dt,

- x: hitX ? lineX : x + (dx * dt),

- y: hitX ? y + (dy * dt) : lineY,

- dx: hitX ? -dx : dx,

- dy: hitX ? dy : -dy,

- };

- }

- var t = 0;

- allParticleKeyframes[index].push(generateKeyframe(0, x, y));

- while (t < animationDuration) {

- var collisionA = detectCollision(0, 1, 0, 1);

- var collisionB = detectCollision(stageWidth, -1, stageHeight, -1);

- var collision = collisionA.dt < collisionB.dt ? collisionA : collisionB;

- if (t + collision.dt > animationDuration) {

- var dt = animationDuration - t;

- t = animationDuration;

- x += dx * dt;

- y += dy * dt;

- } else {

- t += collision.dt;

- x = collision.x;

- y = collision.y;

- dx = collision.dx;

- dy = collision.dy;

- }

- allParticleKeyframes[index].push(generateKeyframe(t, x, y));

- }

- return keyframes;

-function generateKeyframe(t, x, y) {

- return {left: x + "px", top: y + "px", offset: t / animationDuration };

-function Particle(index)

- // Create visual element for the particle.

- var domNode = document.createElement('span');

- document.body.appendChild(domNode);

- // Set colour of element.

- domNode.style.backgroundColor = colors[Math.floor(Math.random() * colors.length)];

- function start() {

- var player = domNode.animate(allParticleKeyframes[index], {easing: "linear", iterations: Infinity, direction: "alternate", duration: animationDuration});

- }

- function destroy()

- {

- document.body.removeChild(domNode);

- }

- this.start = start;

- this.destroy = destroy;

-function onCompletedRun() {

- testRunning = false;

- stopTrackingFrameRate();

- for (var i = 0; i < particles.length; i++)

- particles[i].destroy();

- particles = [];

-</script>

-<style id="keyframes"></style>

-</head>

-</html>