How to achieve fluid and performant complex svg animations?

171 Views Asked by At

I am trying to add svg animations to a react application, the type of animations that I would like to create is similar to the ones seen on discord.com

specifically Im talking about the animation of the black characters here https://discordapp.com/gamebridge

I tried to read the code, obviously its done using something like gsap or react-motion since they use react.

But my question is how could they have precise control and timing on the svg?

I also noticed that the animations stop if they are not into view, is this an optimization technique used by the web developers or is it a browser specific feature?

Thanks.

0

There are 0 best solutions below