How to animate path in svg?

Question

SVG

I looked at all the questions that are repeated on the Toaster, there are implementations but there are no explanations!
I don’t need a ready-made solution, but I need to understand: How does SVG
animation work ? and for any event ... even though this triangle spontaneously changes into a circle , or a star into a book , Here is a small example on SVG where I converted it from an uncontrolled construction to a square on SMIL, otherwise if circle is made rect
then it doesn’t reach me what exactly and how exactly it needs to be done, please explain ...

Answer 1

the general principle is to apply animation breakpoints... ie. to turn a star into a book - you need to draw a star and a book ... here's an example - there is one set of points and they are moved simply
but! the topic is quite tricky and you can’t explain it so simply IMHO here is an article - there are many examples with code ...
here is an example of transformation - there in JS remove the gif's insert and slow down the animation you will <animate dur='xxx'>see ...