The animated GIF is beloved and everywhere — and technically one of the worst ways to deliver motion on the modern web. If you care about speed, replacing GIFs with video is one of the easiest big wins available.
Why GIFs are so heavy
GIF was designed in 1987 for small, simple graphics. It is limited to 256 colours, uses weak compression, and stores every frame inefficiently. A few seconds of animation can balloon into several megabytes — often 5–10× larger than the same clip as video.
MP4: universal and tiny
Encoding the same animation as an MP4 (H.264) video typically shrinks it by an order
of magnitude, with full colour and smoother playback. MP4 plays everywhere. With
autoplay muted loop playsinline on a <video> tag, it
behaves exactly like a silent looping GIF — just far lighter.
WebM: even smaller, modern
WebM (VP9 or AV1) compresses even better than MP4 and supports transparency, which MP4 does not. Support is strong in modern browsers. A common pattern is to offer WebM first and MP4 as a fallback.
When a GIF still makes sense
GIF remains useful where a platform only accepts GIFs — some chat apps, email clients and social features. For those, keep the GIF short and small. Everywhere you control the HTML, use video.
Quick comparison
| Format | Size | Colours | Transparency | Where |
|---|---|---|---|---|
| GIF | Very large | 256 | Basic | Chat/email/legacy |
| MP4 | Small | Full | No | Everywhere |
| WebM | Smallest | Full | Yes | Modern web |