Alice in Web Animations API Land

on YouTube ↗40m

" summary

The Web Animations API claims to unify browser animation engines with timing and animation models so animations become seekable, reversible and inherited; demos use the animate() shortcut and a polyfill to run today in Chrome and Firefox and show concrete tools like playbackRate controls and finish/cancel/ready promises. A playable Alice demo bundles randomized durations, forward/reverse controls and decay of speed and it works in practice via the polyfill, proving the API is usable now.

AI-written summary · about

" chapters (8)

1. 0:00From cartooning to the web
2. 2:37Limitations of web animation
3. 5:04The Web Animations API
4. 8:26Core animation concepts
5. 13:30Building with the API
6. 21:21Shortcut methods
7. 25:16Interactive web experiments
8. 34:09Advanced features and resources

" related talks

• 39mReturn to Web Animation WonderlandRachel Nabors · CascadiaJS 2024
• 38mReturn to Web Animation WonderlandRachel Nabors · Future Frontend 2024
• 15mWeb Animations: Tools and TechniquesRachel Nabors · SquiggleConf 2024
• 28mSweet Web Animations APIRodolfo Dias · code.talks commerce 2018
• 22mSweet Web Animations APIRodolfo Dias · FrontEnd Con 2018
• 20mSweet Web Animations APIRodolfo Dias · Voxxed Days Ticino 2018
• 27mNative Web AnimationLisi Linhart · JSUnconf 2018
• 19m'Web Animations: Past, Present & Future'Ishan Sharma · XtremeJS 2022