Rive is great for web animations, but comes with a tradeoff
Today I learned,
Rive can be a solid alternative to Lottie for optimized animations on the web. It supports interactive state machines, runs at 60 FPS, and the file sizes are way smaller than Lottie.
The biggest downside from my experience is that Rive has to be initialized on the client. It needs a Canvas or WebGL context which only exists in the browser, so there’s no way to pre-render it on the server. This means you get a flash of white or empty space before the animation kicks in. Sometimes it just looks weird, especially on slower connections. You can work around it by hiding the canvas until the rive instance is ready and fading it in, which is a fair tradeoff if you can accept a slight delay before the animation appears.