OLD | NEW |
1 --- | 1 --- |
2 layout: default | 2 layout: default |
3 title: Leaner, Meaner, Faster Animations with requestAnimationFrame | 3 title: Leaner, Meaner, Faster Animations with requestAnimationFrame |
4 live_example_url: /samples/raf/example/index.html | 4 live_example_url: /samples/raf/example/index.html |
5 header: | 5 header: |
6 css: ["/samples/samples.css"] | 6 css: ["/samples/samples.css"] |
7 --- | 7 --- |
8 | 8 |
9 ## {{ page.title }} | 9 ## {{ page.title }} |
10 | 10 |
11 This sample ports the example used in | 11 This sample ports the example used in |
12 [this HTML5Rocks article](http://www.html5rocks.com/en/tutorials/speed/animation
s/) | 12 [this HTML5Rocks article](http://www.html5rocks.com/en/tutorials/speed/animation
s/) |
13 by Paul Lewis about correctly using requestAnimationFrame for your animations. | 13 by Paul Lewis about correctly using requestAnimationFrame for your animations. |
14 | 14 |
15 Use the up and down keys on your keyboard to activate the animation. | 15 Use the up and down keys on your keyboard to activate the animation. |
16 | 16 |
17 Read the | 17 Read the |
18 [source](https://github.com/dart-lang/dart-samples/tree/master/web/html5/speed/a
nimations). | 18 [source](https://github.com/dart-lang/dart-samples/tree/master/web/html5/speed/a
nimations). |
19 | 19 |
20 <iframe class="running-app-frame" | 20 <iframe class="running-app-frame" |
21 style="height:400px;width:100%;" | 21 style="height:400px;width:100%;" |
22 src="{{page.live_example_url}}"> | 22 src="{{page.live_example_url}}"> |
23 </iframe> | 23 </iframe> |
24 | 24 |
25 See all [samples](/samples/) | 25 See all [samples](/samples/). |
OLD | NEW |