The fact that this little animation can have such heavy performance impact tells us one thing: CSS design is flawed. That‘s it. That‘s the whole story.
How can the browser know if an arbitrary animation can change an element's height? I'll bet 10 bucks this is equivalent to halting problem.
Unless you 1) don't support full SVG spec or 2) separate SVG elements from the layout completely, it's not a problem that is solvable by browser. The developers need to wrap their animation in a fixed size element and it's very reasonable to expect them to do so.
Plus, the CSS spec doesn't prevent browser vendors from optimizing this specific use case if it's really that needed.
(Of course in the case of this simple web app in OP, the correct solution is to not use animation at all.)
