WebP - The new web image format
What is it?
WebP is a new, open source, lossless and lossy compression, created specifically for images on the web. Currently developed by Google WebP can produce files considerably smaller than the current PNG, JPG and GIF standards.
| Lossy / Lossless | Reduction | |
| PNG | Lossless | 26% |
| JPG | Lossy | 25/35% |
| GIF (animated) | Lossy | 64% |
| GIF (animated) | Lossless | 19% |
How WebP Works
Lossy WebP compression uses predictive coding to encode an image, the same methodology used by the VP8 video codec to compress keyframes in videos. Predictive coding uses the values in neighboring blocks of pixels to predict the values in a block, and then encodes only the difference (residual) between the actual values and the prediction.
The residuals typically contain many zero values, which can be compressed much more effectively. The residuals are then transformed, quantized and entropy- coded as usual. WebP also uses variable block sizes.
Lossless WebP compression uses already seen image fragments in order to exactly reconstruct new pixels. It can also use a local palette if no interesting match is found. This palette is continuously updated to re-use recent colors. This compression mode is named "VP8L" and shares some common features with the so-called LZ77 compression algorithm.
A WebP file consists of VP8 or VP8L image data, and a container based on RIFF. The standalone libwebp library serves as a reference implementation for the WebP specification, and is available from our git repository and as a tarball.
WebP Support
WebP is currently supported in Google Chrome, Opera and Android Browser.
WebP lossy support
- Google Chrome (desktop) 17+
- Google Chrome for Android version 25+
- Opera 11.10+
- Native web browser, Android 4.0+ (ICS)
WebP lossy, lossless & alpha support (libwebp v0.2.0)
- Google Chrome (desktop) 23+
- Google Chrome for Android version 25+
- Google Chrome for iOS version 29+
- Opera 12.10+
- Native web browser, Android 4.2+ (JB-MR1)
How do I use it?
Because not all the latest browsers support WebP yet (what else is new?), if you are interested in using optimised WebP images for your site, you'll need to target supporting browsers and server the appropriately compressed images. Google Developers has an example JavaScript function to detect the browser's WebP capability here and a free file conversion tools and libraries here.
