My mod.io Homepage My thunderstore

WebPs are very cool!

To illustrate this, I've decided to use this image of a cat, attribution thingy: By Orange_tabby_cat_sitting_on_fallen_leaves-Hisashi-01.jpg: Hisashi from Japanderivative work: Caspian blue - Orange_tabby_cat_sitting_on_fallen_leaves-Hisashi-01.jpg, CC BY-SA 2.0, Link.

A jpg of an orange cat, in good looking quality

Since I renamed the file and edited the picture for demonstration, every picture in this page is a derative work of that cat pic.


1. File size

I will now do a file size test at max quality lossless of WebP and PNG.

WebP lossless, 5298kb

PNG lossless, 7218kb


Then between lossy max quality WebP and JPEG.

WebP lossy, 1809kb

JPEG lossy, 4478kb


Wow! WebP had better results in both test!

Also, webp supports being transparent and compressed, which can allow for cool non rectangle pictures (this image is just 75kb!).

The orange cat, compressed and cropped into a seven sided polygon

2. Animation

There are mainly 3 formats for animated images: GIF, APNG and WebP. GIFs kinda suck, APNG is uhh something? No idea. WebPs are cool.

I'm gonna use this video as a test NairobiPapel(Kamaa), CC BY-SA 4.0, via Wikimedia Commons

Since animated pictures are really big, I'll use a resolution of 144p and 15fps.

Cat playing near a rock, webp

WebP 729kb

Cat playing near a rock, webp

GIF 3449kb

Cat playing near a rock, webp

APNG 9704kb

As you can see, WebP is the smallest, this is because APNG is lossless and GIF is lossless but limited to a 256 color palette, WebP can be compressed.