I've heard anecdotally that setting those css animations via JavaScript vs defining them in a stylesheet, then toggling classes in the code, yields slightly better performance. I have nothing to back that up but would be interested in hearing if other's have noticed the same thing.
To clarify: I don’t have a problem with triggering animations from JS directly. I just have a problem with hard-coding several blobs of unexplained magic css directly into an unrelated function, instead of building a general-purpose animation framework, and calling it by some clear and readable API. As soon as you want to tweak the effect, in this version, you’re in for a pile of trouble. Or if you want to use the same effect on a different view, you’re left copy/pasting. It’s the kind of unplanned code placement that works okay for a demo but quickly falls apart when requirements change or the project grows.
