| 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 = '@-webkit-keyframes anim {\n' |
| 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 += (fraction*100) + '% { transform: translate(' + x + 'px, ' +
y + 'px) }\n'; |
| 19 } |
| 20 return keyframes; |
| 21 } |
| 22 |
| 23 var style = document.createElement('style'); |
| 24 style.textContent = makeKeyframes(numKeyframes, 550, 800); |
| 25 |
| 26 for (var i = 0; i < N; i++) { |
| 27 var target = document.createElement('target'); |
| 28 target.style.webkitAnimation = 'anim ' + duration + 'ms linear infinite -' + d
uration/10 * i/N + 'ms'; |
| 29 container.appendChild(target); |
| 30 } |
| 31 |
| 32 container.appendChild(style); |
| 33 |
| 34 requestAnimationFrame(function() { |
| 35 measurementReady = true; |
| 36 }); |
| 37 </script> |
| 38 |
| 39 <style> |
| 40 body { |
| 41 margin: 0; |
| 42 overflow: hidden; |
| 43 } |
| 44 target { |
| 45 position: absolute; |
| 46 border: 5px solid green; |
| 47 border-radius: 100%; |
| 48 } |
| 49 container { |
| 50 position: absolute; |
| 51 width: 550px; |
| 52 height: 800px; |
| 53 background-color: lightgrey; |
| 54 } |
| 55 </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