The underused Web Animation API
Animations can be a useful tool to enhance the user experience on the web. Aside from providing an appealing visual experience, animations can aid in the user’s understanding of elements appearing, moving and disappearing from a page.
animationend which allow you to react to an animation that finished, though it can still be hard to synchronize animations with application state due to the way animations have to be started. They are a powerful, declarative and performant way to do animations on individual elements.
Benefits of the Web Animation API
- Timing, no need to sync with onAnimationEnd event.
- Separation of concerns, no longer mix the animation logic with CSS styling.
- Huge improvment in control, you can run the animation back and forward programatically.
Check it out!
MDN Browser support is good 👍