| OLD | NEW |
|---|
| (Empty) | |
| 1 <!doctype html> |
| 2 <meta name="viewport" content="width=device-width, user-scalable=no"> |
| 3 <container id="container"></container> |
| 4 <script> |
| 5 var N = 400; |
| 6 var numKeyframes = 500; |
| 7 var duration = 4000; |
| 8 |
| 9 function makeKeyframes(numKeyframes, width, height) { |
| 10 var keyframes = []; |
| 11 for (var i = 0; i < numKeyframes + 1; i++) { |
| 12 var fraction = i / numKeyframes; |
| 13 var t = fraction * 2 * Math.PI; |
| 14 var x = Math.cos(t) - Math.pow(Math.cos(4*t), 3); |
| 15 x = ((x/4 + 1/2) * width).toFixed(5); |
| 16 var y = Math.pow(Math.sin(4*t), 3) - Math.sin(2*t); |
| 17 y = ((y/4 + 1/2) * height).toFixed(5); |
| 18 keyframes.push({transform: 'translate(' + x + 'px, ' + y + 'px)'}); |
| 19 } |
| 20 return keyframes; |
| 21 } |
| 22 |
| 23 var keyframes = makeKeyframes(numKeyframes, 550, 800); |
| 24 for (var i = 0; i < N; i++) { |
| 25 var target = document.createElement('target'); |
| 26 container.appendChild(target); |
| 27 target.animate(keyframes, {duration: duration, iterations: Infinity, delay: -d
uration/10 * i/N}); |
| 28 } |
| 29 |
| 30 requestAnimationFrame(function() { |
| 31 measurementReady = true; |
| 32 }); |
| 33 </script> |
| 34 |
| 35 <style> |
| 36 body { |
| 37 margin: 0; |
| 38 overflow: hidden; |
| 39 } |
| 40 target { |
| 41 position: absolute; |
| 42 border: 5px solid green; |
| 43 border-radius: 100%; |
| 44 } |
| 45 container { |
| 46 position: absolute; |
| 47 width: 550px; |
| 48 height: 800px; |
| 49 background-color: lightgrey; |
| 50 } |
| 51 </style> |
| OLD | NEW |
|---|
Chromium Code Reviews
Issue 402433004:
Test adding perf week tests as smoothness benchmark (Closed)
Base URL: svn://svn.chromium.org/chrome/trunk/src