Why use a transition component when you can just add classes?

Question

Vue.js

A good example of doing the same thing in two ways - https://codepen.io/kodej/pen/eRMmrK
When to use what? Why does , exist at all <transition>, if you can just add Vyuhoy classes? Performance? Are there benchmarks? Or what's the fun?

Answer 1

Imagine that you are adding a vue component to the dom and you need to make an appearance animation. You will have to assign a class in the mount event of the component that will be responsible for the appearance. In order not to write code, but to do it declaratively, there is a transition.