Interface elements built with React and Motion.
A comment field that starts as a single line and grows when you click into it. The height moves on a spring, and the audience and close buttons wait for it to settle before fading in, so nothing appears mid-resize. On close they leave first, then the box collapses. Escape or a click outside closes it.
A loading state for images that take a while, like generated images. Give it the aspect ratio of the image you are waiting for, then fade the result in on top once it arrives. Each cell runs one CSS animation with its own delay, so 1,260 cells cost about the same as a spinner and keep moving while the main thread is busy.