📜 ⬆️ ⬇️

WebP, the new image format for the Internet

As part of Google’s initiative to make the Internet faster, over the past months we have released a whole set of tools designed to help site owners speed them up. We have launched an extension for Firefox called Page Speed , which allows us to study the performance of web pages and also receive suggestions on how to increase it. We introduced Speed ​​Tracer , an extension for Chrome that allows you to find and fix performance problems in web applications. In addition, we released a set of tools for the final stage of development ( closure tools ), designed to help create complex web applications with fully optimized javascript code. While these tools were incredibly successful in helping developers optimize their sites, we continued to work, and we managed to discover the only component of web pages that is fully responsible for most of the page delays: images.

Most of the common image formats used on the web were created more than 10 years ago and are based on the technologies of the time. Engineers from Google decided to check: is there a way to increase the compression ratio of lossy compression algorithms (like JPEG) to allow images to load faster while still maintaining their resolution and visual quality. As a result of working on this project, we are releasing a new image format, WebP , in a preliminary version for developers. This format promises to significantly reduce the binary size of photos on the network, allowing sites to load faster than before.

Today, images and photos make up about 65% of all the data that make up a web page. They can significantly slow down networking, especially in networks with limited traffic, such as mobile networks. Most of the images on the network are lossy compression formats (such as JPEG ), less are lossless compression formats (such as GIF and PNG ). Our team has focused on improving lossy compression, since today it is the images in these formats that make up the majority of all images on the network.

To improve the compression rate that the JPEG format offers, we used an algorithm based on the VP8 codec, the source codes of which were opened by Google in May 2010. We applied the technologies used in VP8 to compress intermediate frames to compress static images. In addition, we used a very compact container file format based on the RIFF format: although this format adds only 20 bytes to each image, it is extensible, which allows authors to save any necessary metadata in the file.
Although the advantages of a VP8 based image format are theoretically obvious, it was necessary to test them in real world conditions. In order to evaluate the effectiveness of our efforts, we selected about a million random images from the network (mainly JPEG, as well as some PNG and GIF) and recoded them into WebP, preserving their visual quality. Such recoding led to a reduction in file size by 39% ( apparently, it meant, on average, approx. Trans .). We expect developers to achieve even more compression with the WebP format, compressing images that were not originally compressed.

To help you evaluate the effectiveness of WebP in comparison with other formats, we have prepared a set of known free images in various formats, also specifying the size of the images, so that you can compare them visually . In addition, we are releasing a converter program that you can use to convert images into WebP format. We look forward to working together with both browser manufacturers and the web developer community, on the WebP specification and on adding support for this format to browsers. Although WebP images cannot be displayed until browsers support this format, we are working on a patch for Webkit that will support WebP in the next version of Google Chrome. In addition, we plan in the future to add support for the layer of transparency, also known as the alpha channel, in the form of an update ( Chrome update or format specification? Not clear. Note. Trans .).

We are looking forward to feedback from the developer community in our group , so download the converter , try it on your favorite set of images, and let us know what you think.

Richard Rabbat, product manager.

Source: https://habr.com/ru/post/105335/

All Articles