Enabling WebP by default

Note: A follow-up post has been published with next steps on this proposal.

Feature Overview

This proposal seeks to integrate WebP by default into WordPress coreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress.. WordPress supports WebP since version 5.8 and users can already upload and place WebP images just like they can JPEG images.  This proposal enhances that support in two significant ways. First, WebP images are now generated by default for new JPEG uploads (in addition to the default format WordPress already generates). Second, these WebP images are now used by default for the website content.

Advantages of using WebP

WebP was developed as a modern image format that provides superior compression on the web. Images are often some of the largest resources used by websites, and using WebP creates websites that are lighter and faster. Compared to JPEG images, WebP images generated by WordPress are almost always smaller, with a ~30% file size reduction on average (with the same visual quality).  

WordPress websites can benefit from WebP today because WebP is supported in all browsers WordPress supports and by both the GD and Imagick image handling libraries WordPress relies on. With this new feature, users can continue uploading and using the same JPEG images they do today and behind the scenes WordPress will create the more performant WebP images and use them for the website. By switching from JPEG to WebP as our default output format, WordPress sites across the web will benefit from improved performance – the primary goal of the Performance team.

How will WordPress enable “WebP by default”?

When users upload JPEG images, WordPress will now create WebP versions of the image and its sub sizes in addition to the JPEG sub sizes it already creates (while keeping the original). When rendering the website, WordPress will use the WebP versions of images when they are available. 

The new support for multiple mime types in core media is designed to be flexible, enabling developers to customize which image formats to generate for a given source image format. The feature is completely customizable via filters, so hosts or developers can adjust the behavior for both image generation (for example only generating JPEG or WebP subsizes) and image display.

Finally, this feature is backwards compatible, extending existing behavior with additional types and data. JPEG images continue to be generated as usual, and stored in the same way as previous versions.

Testing this feature

Please test this feature to help catch and accommodate as many use cases as possible! You can test this feature out using the Performance Lab plugin “WebP Uploads” module.  Developers can review code and give technical feedback by testing the latest patchpatch A special text file that describes changes to code, by identifying the files and lines which are added, removed, and altered. It may also be referred to as a diff. A patch can be applied to a codebase for testing. on the Trac ticket or Pull Request

Next Steps

The TracTrac An open source project by Edgewall Software that serves as a bug tracker and project management tool for WordPress. ticketticket Created for both bug reports and feature development on the bug tracker. targets WordPress 6.0 to land this feature, as long as image component and core maintainers agree the patch is ready. Landing this feature in core will provide significant benefits to WordPress users,  so please help us by testing the feature and leaving your feedback on the Trac ticket or Pull Request

Thanks to @mitogh, @flixos90, @tweetythierry, @addyosmani and @joemcgill for reviewing this proposal and to the many contributors who helped develop and test this feature.

Frequently Asked Questions

  • How can I disable or control the behavior of this feature?
    • Two new filters control mime type(s) output (`wp_upload_image_mime_transforms`) and output( `image_editor_output_format`). See Trac ticket for full details on using these filters. Non-developers can use plugins to adjust the behavior.
  • Can WordPress generate only WebP images? 
    • Yes! Output type(s) are completely controllable with code (filters) and non-developers can use plugins to adjust the behavior.
  • Will WordPress create sub-sized PNG or GIF animated, transparent or lossless images?
    • This feature currently only handles lossy JPEG or WebP images, although it can be expanded in the future.. The WebP format does support lossless, transparency and animation, however support in the GD and Imagick libraries that WordPress relies on for images are limited to only certain features. 
  • I’ve heard WebP images are sometimes larger than JPEGs, how does WordPress address that?
    • WordPress now tracks the size of images it creates, so WordPress can directly compare the sizes and potentially choose the smallest size. However, in the research so far on  issue: https://github.com/WordPress/performance/issues/7 indicates every lossy WebP winds up being smaller than the equivalent JPEG.  
    • When comparing image sizes it is important to use actual images generated by typical WordPress servers, which is different from what you can achieve using dedicated image tools. For example, most servers don’t support “MozJPEG” compression which is more efficient than standard JPEG compression.
  • What happens if I upload a WebP image to WordPress
    • WordPress will now generate both WebP and JPEG sub sizes when you upload a WebP. WebP will be used as the default for front end display and you will have JPEG versions available if you need them.
  • What if my server doesn’t support WebP
    • This feature requires server-side WebP support: if your server lacks support, images will continue to work as they always have.
  • What if my website visitor’s browsers don’t support WebP
    • If you know your website visitors commonly use one of the very few browsers that lack WebP support (for example Internet Explorer 11 or Safari on MacOS < v11 Big Sur) you can disable this feature using a few code lines or a simple mini pluginPlugin A plugin is a piece of software containing a group of functions that can be added to a WordPress website. They can extend functionality or add new features to your WordPress websites. WordPress plugins are written in the PHP programming language and integrate seamlessly with WordPress. These can be free in the WordPress.org Plugin Directory https://wordpress.org/plugins/ or can be cost-based plugin from a third-party (more details before launch).
  • How will this affect server resource usage?
    • When users upload images, WordPress will have to work twice as hard to generate both WebP and JPEG images and will use an additional ~70% of the storage space to store both file types. On the other hand, bandwidth consumption from website visitor image loads will decrease by approximately 30%. Hosting environments with constrained resources may want to disable this feature, or generate only WebP images.
  • Does this feature work with existing plugins that generate WebP images?
    • Yes. Core will provide extension points so existing plugins can serve already generated WebP images, and/or use core’s new generation capabilities (work ongoing in this issue).

#core-images, #media, #performance