A Comparison of Animation Technologies | CSS-Tricks

Source: A Comparison of Animation Technologies | CSS-Tricks

A really nice overview of pros and cons of current (2016) animation technologies. Some of the main points below. For detailed information, visit the link

Native animation

  • CSS
    pros: great performance, responsiveness.
    cons: chaining multiple animations complicated, quirkiness in css+svg
  • Canvas
    pros: really nice for interaction, good performance
    cons: difficult to make accessible, difficult to make responsive, not retina-ready
  • SMIL
    cons: losing support
  • Web Animations API
    pros: Easy sequencing of animations, good performance
    cons: Support is not great, specs still changing
  • WebGL
    pros: Really good in interactive and 3D effects, amazing visual effects, hardware-accelerated, VR-possibilities
    cons: Tougher to learn, hard to make responsive

Read More