Magento 2 Page Speed Webp ImagesPage Speed

« Back to Magento 2 Page Speed

What are WebP Images?

WebP is a new image format created by Google and allows you to create images on average 26% smaller compared with PNGs and 25%-34% smaller compared with JPGs. The new WebP images will look the same as the original WebP images but will be smaller in file size.

Enabling WebP Image Conversion

WebP conversion is enabled by default but can be disabled in the module's configuration area in the Magento Admin.

What Images can be Converted to WebP?

Currently both JPG and PNG images can be converted to WebP.

Images found in the media and static directories can be converted and this includes your product and category images.

Images from WordPress and integrated into Magento using Mgento WordPress Integration.

Can Images in CSS be Converted to WebP?

Yes images in CSS will be converted to WebP and a comprehensive WebP CSS fallback will be in place.

Can Images Images in AJAX Requests be Converted to WebP?

Certain types of AJAX requests will have images converted to WebP. For example the customer sections AJAX request (that loads the mini cart) will have images converted to WebP.

WebP Fallback

WebP support is determined by analysing the HTTP-Accept header and searching for image/webp string. If a browser supports WebP then this will be present and WebP images can be served. If this is not present then the original images should be served instead.

This change happens directly in the HTML so the user will only see the image URL that their browser supports.

For CSS files, a duplicate of the CSS file is created with the image URLs converted to WebP. If your stylesheet was styles.css (or styles.min.css) then a copy of this would be created called styles.web.css (or styles.webp.min.css). If the user was unable to accept WebP images, a simple find and replace would occur changing .webp.css (and .webp.min.css) to .css (and .min.css).