Push Zone Supports WebP and Brotli
The feature WebP caching and Brotli compression is now also available for Push Zones! WebP caching is automatically active once Image Processing is enabled and will transform images to WebP if the client supports the format. Image hosting in combination with WebP has never been easier. Brotli compression is now also enabled for all Push Zones by default which results in great performance improvements. The feature allows to upload assets with custom compression.
Advantages of WebP
WebP has become a popular image format. It achieves a significantly better compression compared to JPEG. Since launching WebP caching for Pull Zones, a lot of customer started optimizing images with great success. Not all browsers support WebP yet, however, most browsers do.
Here's why it's worth using WebP:
- Smaller images result in faster loading times.
- No need to transform images before uploading to a Push Zone.
- Popular browsers support WebP.
- Ideal for mobile users.
How to deliver WebP
Once the feature Image Processing is enabled, there is no further action required. Everything is done automatically by the Image Processing engine. WebP is dynamically delivered based on the header
Here's an example of a request where WebP is delivered:
curl -I 'https://pushsample.keycdn.com/example.jpg' -H 'accept: image/webp' HTTP/2 200 server: keycdn-engine date: Thu, 06 Jun 2019 08:29:50 GMT **content-type: image/webp** content-length: 56734 last-modified: Tue, 14 May 2019 23:36:28 GMT etag: "5cdb50fc-1040a" expires: Thu, 13 Jun 2019 08:29:50 GMT cache-control: max-age=604800 x-ip: 1 x-ip-info: osz=56734 odim=700x467 ofmt=webp x-cache: HIT x-shield: active x-edge-location: chzh access-control-allow-origin: * accept-ranges: bytes
As the feature Image Processing is enabled, the full range of image processing operations are available, such as resize, overlay, and crop.
How to deliver Brotli with custom compression
Brotli is the next generation compression algorithm which will further reduce file sizes compared to Gzip. Brotli compression for Push Zones works the same way as it does for Pull Zones. Based on the header
accept-encoding the correct compression format is delivered.
The same asset can be uploaded to a Push Zone with different file endings specific for Brotli and Gzip. Here's an example:
style.cssis the regular asset that will be delivered if no compression applies.
style.css.gzis the asset with Gzip compression.
style.css.brhas been compressed with Brotli. The compression level can be defined.
The two new features for Push Zones will make it really easy to deliver WebP images and Brotli compressed assets. Both features will boost performance and make your website faster.