WebP is a relatively new format from Google. Pictures in this format take up 30% less space on the page due to the special compression built on encoding key frames in the VP8 video codec.
WebP supports lossy and non-compressed compression, varying degrees of transparency, metadata, and may contain an embedded ICC profile. But not all browsers and applications
support the format yet.

')
How does the compression in WebP
Lossy compression is based on the statement that the brightness and color of neighboring pixels differ little from each other.
The image is divided into macroblocks. Inside each macroblock, the decoder predicts the brightness and color of the next pixel based on previously obtained blocks. It uses already decoded pixels in close proximity to each of the macroblocks, and tries to paint over unknown fragments in them. Thus, data on fragments that can be predicted can be considered redundant and removed from the code, which provides more efficient compression.
After a mathematically reversible transformation (using
DCT ), the result is subjected to quantization and entropy coding.

Lossy webp
Lossy WebP uses
arithmetic coding , one of the algorithms for entropy compression. In WebP, block quantization is used and the bits are distributed adaptively between different image fragments: fewer bits for low entropy fragments and more for high fragments. This encoding is considered more flexible than
the Huffman code (which uses JPEG).
JPEG divides the image into identical blocks, and WebP coding technology uses smart division. In those parts of the picture where there are many small and rapidly changing parts, blocks are 4 x 4 pixels in size and 16 x 16 in monotonous areas.

How is the prediction
The VP8 decoder has 2 prediction classes:
- Intra - intraframe spatial prediction of a block based on pixel values from adjacent, already encoded blocks, from the left and from the top.
- Inter - interframe temporal prediction (estimation of motion vectors).
Intra has four prediction algorithms for 16x16 blocks and 8 for 4 × 4 detail blocks:
- H_PRED horizontal prediction. Fills the next column based on the one to the left of it.
- V_PRED vertical forecasting. Fills the next row based on the previous top.
- DC_PRED fills the block using the averaged color and brightness values of the row pixels
- TM_PRED fills the block, using not only the average values of row A and columns L, but also pixel P, which is located above and to the left of the block. Each line starts with a pixel in column L and is filled in accordance with the differences of pixels in a column, starting from pixel P.
The image is divided into segments that have clearly similar characteristics. For each such segment, the compression parameters and prediction methods are configured independently. Thus, bits are redistributed to where they are most useful.

Lossless compression
In lossless compression, a variant of the
LZ77 Huffman Code algorithm is used. As well as spatial prediction and color space conversion.
Not only forecasting
Compression with alpha channel
WebP format allows you to get a compressed image with a lossless alpha channel. Previously, to get transparency, the entire image had to be lossless. And in WebP, you can reduce the weight of the image with transparent areas.
Color conversion
WebP also uses adaptive quantization of the color component to prevent the color channels from affecting each other. The image is divided into blocks and for each block its own transformation mode green_to_red, green_to_blue or red_to_blue is applied. The color conversion keeps the value of the green channel G unchanged, converts red R depending on green, and blue B depending on green, and then depending on red.
Color caching
Compression lossless WebP uses already processed image fragments to work with new pixels. If no matching matches are found, the locally created palette is used. This palette is constantly updated with the colors found when scanning the image.
Palette indexing
If the picture uses less than 256 colors, the algorithm creates a separate array of color indices and saves it separately to replace the color value with the index for each pixel.
For images with a small number of small parts, upscaling technology is used. Before being encoded - the image is resized.
The article is based on
this material. And you can try webp compression
here .
Abstract
- In WebP, the picture is divided into macroblocks. 4x4 px blocks for small parts and 16x16 for monotonous areas.
- Inside each macroblock, the decoder predicts the brightness and color of each next pixel based on previously obtained.
- In lossy WebP, arithmetic coding is used, and in lossless, a Huffman code is used.
- WebP allows you to get a compressed image with a lossless alpha channel.