Universitat Oberta de Catalunya

WEBP, a new web oriented image format (english version)

Recently, Google has proposed a new image encoding format called WEBP (a). As you might guess from its name, is specifically targeted to encode images that are posted on websites.

Ver la entrada en castellano

Introduction

Initially, Google has opened the algorithm code that encodes and decodes images in this new format and made available to the public an application to convert images to and from it, although only for the Linux operating system, however, and by releasing the code, third parties have developed applications for Windows and javascript versions for WEBM compatible browsers. Even there have been applications such as Pixelmator, which have adopted the new format, allowing you to record and upload WEBP images.
The new WEBP format of Google is a lossy compression one that is based on the intraframe encoder of the VP8 video compressor. In simpler words, it is based on the process used in the VP8 algorithm to encode an image independently of the other images. It is not intended to give an exhaustive technical description of the format, if you are interested in it, please consult the following link, which contains more information.
The format has received both praise and criticism. The first, by reducing the bandwidth required to transmit images in the order of 40%, while improving the quality of images compared to JPEG, the second, to propose an algorithm with a blur much greater than that produced by the JPEG, obtaining therefore lower quality images. But not all claims are disagreements, and it appears that all parties agree that the WEBP encoder consumes more computing resources than the JPEG format. In this article we have tried to clarify their discrepancy and to help readers get a clearer idea of the main advantages and disadvantages of this new format.

Google Analysis

Google provides an analysis of the new WEBP format on its website. This is a focused analysis to study the mathematical difference between original and encoded images. Specifically, it analyzes the PSNR (Peak Signal-to-Noise Ratio or SNR) of different images: the less distortion introduced by the encoder, the higher the PSNR. It has been shown that an increase of PSNR does not necessary translate in an increase of perceived quality [1]; thus, this part of the analysis done by Google remains weakly justified. On the other hand, in a brief line of text, Google explicitly states that visual inspection of 100 images has been carried out, but does not give any more details of this anaysis.
In addition, Google provides examples of WEBP coded images, comparing them with their JPEG version. The quality of these images is high in both cases, which makes very difficult to see differences between the two formats, indirectly conveying the message that WEBP images occupy less and are just as good as the JPEG ones. A simple, straightforward message, but it is missing more examples, especially in borderline cases, in order to have a clearer idea of when to use WEBP and when not.
In short, Google provides a poor and weakly justified analysis about its new format, which does not help to defuse criticism and is insufficient to give rise to the wonders that are told in short news items and many blogs.

Mosaic Analysis

The provided analysis is completely subjective and has no scientific value, but gives examples that are considered clear enough to let everyone do their own reading and testing, similarly to what has been done here. The purpose is to show the performance of WEBP under high and low compression rates and compare it to JPEG performance. To do this, we use the 400×400 color pixels image, weighting 304 KB and shown in Figure 1.

Figure 1. Original and uncompressed test image of 400×400 pixels and 304KB.

This image contains a variety of visual information, as it presents a good contrast and flat areas, and details and contours in all directions.
For WEBP conversions we have used the application provided by Google for linux, running it under a virtualized Linux on an iMac. For JPEG conversions, the JPEG algorithm was used under a MATLAB platform.
High compression
The JPEG algorithm can compress the original image at 4KB, resulting in the image of Figure 2.

Figure 2. JPEG compressed test image to 4KB.

Regarding WEBP, compressing the image to a similar size of 4KB provides the result shown in Figure 3.

Figure 3. WEBP compressed test image to 4KB.

As you can see, WEBP keeps details as petals, leaves and even some stamens contours, avoiding the unpleasant mosaic effect shown by JPEG, which also presents a major distortion in the contours of the petals. If these images are displayed in a smaller size (due to, for example, be displayed on a mobile device, which have small screens, but high pixel density), then images similar to those shown in Figure 4 are obtained.
Original (304KB) JPEG (4KB) WEBP (4KB)

Figure 4. Three test images displayed at a smaller size. From left to right: original image, JPEG image and WEBP image.

Figure 4 shows that WEBP image is much more similar to the original than the JPEG one.

WEBP image is perceived very similar to the original with the exception of the stamens and some contours of the petals, while the JPEG image has serious distortions, especially in its color and contours (creating false and modifying existing ones).

Low compression

Here, we use a low compression ratio, obtaining images of 32KB. In the case of JPEGm the obtained image is shown in Figure 5.

Figure 5. JPEG compressed test image to 32KB.

As can be seen, the perception of the image is the same or nearly the same as the original. Regarding WEBP, compressing the test image to 32KB results in the image shown in Figure 6.

Figure 6. WEBP compressed test image o 32KB.

In this case (Figura 6), and similarly to that of Figure 5, very little (if not any) difference between this image and the original can bee observed. However, if we look more closely at some details of the picture, as shown in Figure 7, you can see how subtle changes are masked in the WEBP case.

Figure 7. Detail comparison of test image compressed to 32KB under JPEG and WEBP.

You can see the blur of WEBP compressed image detail.
The effect is like a blur, as pointed by some authors. This blurring effect is selective, since the contours of the petals and even the stamens are clearly defined. It seems that the WEBP format removes certain details of the image, those very subtle and very abrupt. To analyze a little more this effect, Figure 8 shows the difference images between each original format and also their spectral representation.

Figure 8. Analysis of detail lost when compressing with JPEG (left column) and WEBP (right column).

Difference between original test image and its compressed version is shown in the top row, while the spectral analysis of the difference images is shown in the bottom one.
As shown in Figure 8, the difference image (top row) contains the outline of the flower and some leaves of the image. This is logical, since lossy image compression formats, such as JPEG and WEBP, remove information starting with the details found on the contours, which define the shape of objects. You can also see that the WEBP difference image contains a sort of random “fog”; this “fog” translates into differences between the original test image and its WEBP version which do not appear (since the fog is not present) on the difference between the original test image and its JPEG version.
The bottom row shows the spectral content of the two difference images (shown in the top row). These spectral images contain low frequencies (associated with flat areas or with little detail) in the corners and high ones (associated with the details) in the center. The spectral image is almost uniform in the case of JPEG; however, regarding WEBP, it has a prominent central point representing high frequency content. This means that the difference between the original test image and its WEBP version has small details, these which are not present when compressing with WEBP; the loss of these details is, in fact, the reason why WEBP image becomes blurred in certain specific areas, losing the detail that does appear in the JPEG image (see Figure 7 for an example).

Discussion

From the differences discussed in the preceding paragraphs, it can be interpreted that WEBP offers much better quality than JPEG with high compression rates; nevertheless, quality is a little worse for WEBP because of the blurred effect in small areas when using a low compression rate.
However, if you review the aims of this format, you can see that it is a web-oriented format. Most web images are uploaded with high compression rates, since its main aim is not to show very large images at high quality. If this is the case, there are more effective ways to share and / or publish than web pages themselves (such as virtual hard disks or file servers).
On the other hand, the blurring of details that are provided by the WEBP format does not claim itself as the best format to encode high-quality images, which would not be appropriate for signage applications, for example. In fact, this feature is shared with JPEG and, in general, with all lossy compression formats.

Summary

WEBP format is shown as a fully oriented web image, providing far superior visual quality than JPEG, as claimed by Google and many other users, but bearing in mind that these benefits only appear when using the high image compression levels used in the web to reduce the image weight as much as possible while keeping a minimum visual quality.
If you want to use low image compression levels, minimizing the loss of detail (for example, capturing images using a digital camera) and therefore obtaining high-quality images, WEBP format can also be, but the user must keep in mind that he will not be using the best possible encoder (such as other websites criticize), and, indeed, it is possible that JPEG could obtain better results in these cases. We cannot say that JPEG is better than WEBP in theses cases because the differences are very subtle and more rigorous studies should be necessary to analyze them.
Finally, if you want really high quality images without losing image details, do not use any lossy compression format, thus ruling out both WEBP and JPEG.

References

[1]: Li, J., Chen, G., Chi, Z. y Lu, C. (2004). “Image Coding Quality Assessment Using Fuzzy Integrals With a Three-Component Image Model”. IEEE Transactions on Fuzzy Systems, 12(1), pp. 99–106. ISSN 1063-6706

Etiquetas:

Acerca del autor

javier_melenchon-49x75

Javier Melenchón Maldonado es Doctor por la URL en Tecnologías de la información y las comunicaciones y su gestión. Es profesor de los estudios de informática, Multimedia y Telecomunicación de la Universitat Oberta de Catalunya, profesor en el Grado en Multimedia de la UOC y director del Máster Universitario en Aplicaciones Multimedia de la UOC.

Su ámbito de trabajo cubre el tratamiento, publicación y distribución de contenidos digitales de audio, imagen y vídeo. Es autor de materiales docentes así como diversas publicaciones científicas relacionadas con este ámbito.

Es miembro del grupo de investigación ITOL (Interactive Tools for Online Learning), con cuyos miembros trabaja para mejorar la experiencia de aprendizaje online por parte de los estudiantes en las materias de tratamiento, publicación y distribución de contenidos digitales.