Steve Faulkner tiene una idea inteligente aquí. Puede mostrar un GIF (animado) y superponer un botón de pausa / reproducción encima, que es realmente un <details>
/<summary>
elemento. Cuando se alterna, un JPG (no animado) en el interior cubre el GIF, efectivamente “pausándolo”.
Adrián Roselli lo llama una forma “rápida y sucia” de pasar el Criterio de Conformidad WCAG 2.2.2 Pausar, Detener, Esconderse.
Lo bifurqué, cambié todas las imágenes para que muestre el JPG primero y puse loading="lazy"
en las imágenes. Parece que efectivamente no carga el GIF hasta que presiona explícitamente reproducir, por lo que esa también es una opción: