Simon Willison built a Web Component called <click-to-play> that stops GIFs from auto-loading by replacing them with a static first frame and a play button. The GIF only fetches when the user clicks.
The implementation is a progressive enhancement wrapper: drop an anchor linking to the GIF around an img tag showing the first frame, wrap both in the custom element, and the component handles the rest. No JavaScript, no GIF load if the user never asks.
Willison built this specifically for a Datasette post demonstrating new row editing tools. The live example is worth visiting to see both the component in action and what Datasette's editing interface now looks like.
[READ ORIGINAL →]