Silky smooth Web Animations

Web Animations is a new animation model designed by multiple browser vendors and is now shipping in Blink. Chrome shipped CSS Animations and CSS Transitions running on top of Web Animations at the end of 2013. New Web Animation capabilities are now exposed in JS and give web developers powerful creative control of animations from JS but without jank. The Web Animations engine is one of the core features used by the Polymer project. This session explains the model, the new APIs, how to use them and shows real world examples of how to integrate them into your sites now.

[GoogleDevelopers]

*Today’s IO Byte is: Silky smooth Web Animations*
w/ Alex Danilo: #iobytes   #io14   #developers  

Web Animations is a new animation model designed by multiple browser vendors and is now shipping in Blink. Chrome shipped CSS Animations and CSS Transitions running on top of Web Animations at the end of 2013. New Web Animation capabilities are now exposed in JS and give web developers powerful creative control of animations from JS but without jank. The Web Animations engine is one of the core features used by the Polymer project. This session explains the model, the new APIs, how to use them and shows real world examples of how to integrate them into your sites now.

[stoikerty]

It doesn't matter much if you have short links when you need to type them in. The youtube description would have been a tremendous improvement to place your links, providing silky-smooth transitions into your polyfill.

[DerClaudius]

Please also always put all links in the description.

[erikvan]

Could you elaborate how this compares to GSAP? I feel that GSAP is just an abstraction of your web animations lib, making it even easier to create animations and also incorporates all these polyfills automatically. Am I right or missing the point?

[MikeBritton]

I'm pumped about this, but won't go near it as a developer until it's universally polyfilled across all modern mobile and native web browsers.

[shreyarathodThequeen]

its awesome google doodle smooth animation... 

[alany]

The "stars demo" link is not working, but very nice presentation!

[vivekjadhav]

You showed me a new way to do something..

[wierdvue]

The Stars demo is giving an error - ParGroup is not defined 

[LuchoJavaNet]

Nice presentation. Error in Stars demo: Uncaught ReferenceError: ParGroup is not defined (index):80 (anonymous function) Using Chrome.

[Sarcastix]

All of the world cup Google doodles have had silky smooth animation

[KevinSheppard]

very nice, but I want to wait till this matures a bit before I try it in my production apps.

[zbpl]

Implement it in Firefox first, then we'll see.

[Stimpy]

Just say 'no' to "jank"!