Yes indeed all modern video codecs are based on encoding differences between key frames. GIF has the most basic implementation of that (it can update only a window in the image instead of the whole image).

The original GIF can actually be compressed losslessly down to just 1.4MB with a better compressor like https://gifcompressor.com .

MP4 (and similar codecs) are not typically very good at compressing regions of constant colour, while GIF is very good at that. However I have to admit that the output of that converter is acceptable in MP4, better than I would have expected (though noticeably worse quality).

BTW curiously (likely to better performance on regions of constant colour) the non-lossy WebP does better on this example coming in at just 1.2MB!

2 MB is huge over mobile for a simple graphic illustrating one of many, many features.

If you really want to use GIF, it would make more sense to manually create an animation out of frames you define, switching between highlights of that feature, rather than a screen recording that captures every minor, irrelevant animation and follows the hover popup as it moves around a few pixels. That's just a waste of bandwidth. A manually curated GIF of that size could be like 40 kB or so, not megabytes.

Otherwise, I'd argue MP4 is by far the superior option for this use case given its far smaller size, where visitors just need to know at a rough glance what a feature does, not examine it for pixel perfection. An imperfect video that loads in 20% of the time is preferable than waiting forever for a huge gif to load.

All I know is that when I find an actual gif it's really easy to save and share, but when I find a "gif" that's actually a video, shit never works right.

Keep gifs. More gifs, even. Down with videos where gifs would do.

Also, raw size isn't everything. What's memory use look like during playback? CPU use? Higher? Spikier? I know there's hardware decoding for common codecs but wouldn't be surprised if videos still use more CPU than gif, in practice.

Gifs look like garbage for video though, and take up 10x the space.

I'm the opposite. I wish they'd just deprecate gif everywhere and then we'd see better video support.

CPU usage shouldn't be an issue for small web video clips on any semi-recent device, my phone records 4k 60fps HEVC HDR10+.

> Gifs look like garbage for video

We're speaking of animated graphics, right ?

> my phone records 4k 60fps HEVC HDR10+.

Reminds me of the rant of one of the Google camera app devs on a podcast, where they tried to see with the android guys if there was any way to just force kill every other app processes while the camera app if on the foreground to guarantee it would have enough resources upfront to do its job.

Now playback efficiency should mostly rely on the codec and wether it's hardware supported, but I wonder if there would be a pipeline effect when you're trying to play 25 videos at the same time and they all need to go through the hardware decoder.

>We're speaking of animated graphics, right ?

Hmm, wouldn't proper video codecs be better in any case?

Whatever settings they use for animated cartoons would be good for animated graphics. I can't imagine a modern codec could be less efficient than gif.

>Now playback efficiency should mostly rely on the codec and wether it's hardware supported, but I wonder if there would be a pipeline effect when you're trying to play 25 videos at the same time and they all need to go through the hardware decoder.

Hopefully it would stop playing them when they're not visible. But you're right, that is a good question as I doubt the decoders have really been designed with that usage in mind, rather to optimize for a single aforementioned high-res video.

Most video codecs, including H.264 and H.265, encode in frequency space (after DCT transform) on a block-by-block basis, discarding high-frequency information (the edges of text and graphical elements are high frequency information). That's why you can see blurriness and ringing around edges in text and graphical images with a video codec. It's not what they are designed for.

GIF uses Lempel-Ziv compression, meaning it can encode repeating information efficiently ("the next 10 pixels are the same colour as the last 1"). Efficient if there are a lot of areas of the same colour or repeated patterns.

GIF uses RGB colour space just like your screen, so there is no loss of colour information if there are fewer than 255 distinct colours per frame (typical for text & simple screen graphics!). Video codecs (like H.265) typically use YUV420 colour space, meaning that colour information is encoded at lower resolution than brightness.

Palette based colour encoding (like GIF uses) is quite efficient when there is a small number of distinct colours in an image / video (like in the videos in the article...).

As another example the encoder at https://compress-or-die.com does a quite impressive job at compressing the GIF if allowing some loss of visual quality. Taking the number of colours down to 14 and allowing lossy compression I got the file size down to 386kB: https://compress-or-die.com/gif-process?expert-mode=no&exper...

I'd consider that a good trade-off given the universal compatibility of GIFs, and no ringing in the decoded video.