When requirements read “when visible” your brain should go straight to
IntersectionObserver. That’s exactly what Zach is doing here to kick off an animation when it scrolls into view.
Except this animation is an SVG SMIL animation: an
Also check this out:
:scope thing is new to me.
Is SMIL not dead/dying anymore? According to this CSS-Tricks article from 2015, it was dying because support was waning in WebKit and wasn’t going to get much support at all from IE/Edge at the time. Is that still the case? Obviously a lot has changed about Edge since then.
It was even more dire for a while, as Chrome hinted about literally ripping it out. But I don’t think that’s the case anymore (although I have nothing to cite) and now Edge has it because of Chromium, so maybe it’s just here to stay.