Plan for adding WebP & multiple MIME support for images

Plan for adding WebP & multiple MIME support for images

This post is a follow up to the “Enabling WebP by default” proposal post (and the follow up to that post). 

TL;DR – The Performance Team has reviewed feedback, conducted research, and reassessed the approach based on our findings. Our new approach – outlined below – aims to address the concerns raised on the original proposal.

Overview

The Performance Team takes community feedback very seriously. As a result of the concerns around our previously proposed approach to serving WebP, we took a step back to reassess and dig deeper into the specific issues raised in post comments, chat, and elsewhere. This work has included:

  • Reviewing comments from the original and follow-up posts
  • Engaging in research (as noted in #289 & #290) on the storage impact of additional WebP images being created on upload and WebP compatibility across browsers, email clients, etc.
  • Sharing a survey with hosting providers to gather information about their storage and disk space infrastructure

What we found

Our goal with this research and reassessment was to collect data and additional context about each of the concerns raised by the community. With this additional information, we were then able to better understand and prioritize concerns, as well as determine how and why our approach to adding WebP should be modified.

WebP Compatibility

The team did additional research on WebP compatibility to better understand where compatibility issues might cause issues for users. Our research indicated that most compatibility issues were very minor and/or addressable:

  • Web browser compatibility: Only Safari on Mac OS < 11 and iOS < 14 do not support WebP, which is < 3% of all browser usage. This small percentage of non-supporting browsers will be served JPEG images. 
  • Email clients: > 97% of clients support WebP.
  • Mobile apps (web views): iOS 14+ supports WebP (and otherwise will be served JPEG images with the new approach). Android supports WebP natively from Android 4.0.
  • RSS readers: Top RSS readers all support WebP, so RSS feeds can likely leverage WebP.
  • Other: Open Graph tag consumers have mixed support, so OG tags should remain JPEGs for compatibility.

Storage

To assess the overall impact of generating WebP images on site storage, the team surveyed hosting providers. With a total of 17 responses, the results show that the number of stored files is generally not an issue for most hosts/sites, although storage space could become an issue for some users over time. Still, for large hosts (with 1,000 or more hosted sites), the vast majority of sites (> 86%) would be unaffected, even if their storage requirements doubled. We also learned that some lower-end hosting plans with limited storage also lack WebP support in their hosting stack, which means they won’t get extra image generation anyway.

The revised approach

Based on the results of the research outlined above, our new proposed approach addresses compatibility issues by:

  • Providing a tiny (355 bytes uncompressed) JavaScript snippet that detects browsers that lack WebP support and loads JPEGs instead [tracking issue]
  • Only using WebP for user-facing content in the front-end (template) context. Images in other contexts like Open Graph tags, RSS feeds, and REST endpoints would continue to use JPEGs [tracking issue]
  • Adding a new parameter to the `add_image_size()` function that lets developers control whether to generate additional MIME types for each size registered. For the vast majority of image sizes this should be set to `true`; the only exceptions are image sizes that are being used exclusively outside of user-facing front-end content, such as Open Graph tags. Only for those special cases should the parameter be set to `false` to not generate additional MIME types. Developers registering custom image sizes with `add_image_size` will need to specify if the size should generate secondary MIME types by version 6.2, when we plan to make this behavior the default in core.

This new approach also addresses concerns around storage requirements by:

  • Automatically generating WebP versions of only core image sizes in 6.1 by default. Custom image sizes will initially have to opt in to receive automatically generated WebP versions, or opt out if they are exclusively used for special cases where WebP is not beneficial or supported.
  • Keeping secondary (WebP) sub-sizes only if they are smaller than the primary MIME type.
  • Only generating WebP images for image sizes that are intended for use in user-facing front-end content. This avoids wasting storage space for WebP images that will never be used.
  • Introducing a filter to control the generation of additional MIME types based on image sub-sizes. This enables developers to exclude certain image sizes, such as those that are not used in front-end content. 

Next Steps

The approach in the core patch is being updated to reflect the revisions outlined above. The current plan is to merge this change early in the 6.1 release cycle so that it can be thoroughly tested. Additional feedback regarding this revised approach can be left on this post or the Trac ticket.

#core-images, #media, #performance

","commentTrashedActions":"

","mentions":[],"mentionContext":"","commentCreated":"1656623075","hasChildren":false,"userLogin":"lukefiretoss","userNicename":"lukefiretoss"},{"type":"comment","id":"43275","postID":"97231","postTitleRaw":"Plan for adding WebP & multiple MIME support for images","cssClasses":"comment byuser comment-author-leehodson even thread-odd thread-alt depth-1","parentID":"0","contentRaw":"This is good. I look forward to WP support for WebP by default.nnThree questions:nn1. Will WP use the database to track WebP images or (e.g.) an Apache FilesMatch test to check for WebP images?nnI think a FilesMatch test will work best with respect to backwards / sidewards compatibility with WebP enabling plugins.nn2. Will WP 6.1 offer to create WebP images or delete then recreate WebP images for existing images?nn3. If the answer to question 2 is yes, how will WP handle images that are not tracked in the database i.e. WebP images created by plugins or those uploaded directly to the WP upload file space that are not tracked/indexed in the database?nnLee","contentFiltered":"

This is good. I look forward to WP support for WebP by default.

n

Three questions:

n

1. Will WP use the database to track WebP images or (e.g.) an Apache FilesMatch test to check for WebP images?

n

I think a FilesMatch test will work best with respect to backwards / sidewards compatibility with WebP enabling plugins.

n

2. Will WP 6.1 offer to create WebP images or delete then recreate WebP images for existing images?

n

3. If the answer to question 2 is yes, how will WP handle images that are not tracked in the database i.e. WebP images created by plugins or those uploaded directly to the WP upload file space that are not tracked/indexed in the database?

n

Lee

n","permalink":"https://make.wordpress.org/core/2022/06/30/plan-for-adding-webp-multiple-mime-support-for-images/#comment-43275","unixtime":1656624152,"loginRedirectURL":"https://login.wordpress.org/?redirect_to=https%3A%2F%2Fmake.wordpress.org%2Fcore%2F2022%2F06%2F30%2Fplan-for-adding-webp-multiple-mime-support-for-images%2F%23comment-43275&locale=en_US","approved":true,"isTrashed":false,"prevDeleted":"","editURL":null,"depth":1,"commentDropdownActions":"","commentFooterActions":"

","commentTrashedActions":"

","mentions":[],"mentionContext":"","commentCreated":"1656624152","hasChildren":false,"userLogin":"leehodson","userNicename":"leehodson"},{"type":"comment","id":"43276","postID":"97231","postTitleRaw":"Plan for adding WebP & multiple MIME support for images","cssClasses":"comment byuser comment-author-cybr odd alt thread-even depth-1","parentID":"0","contentRaw":"How much weight does a typical site lose serving Googleu2019s WebP over JPEG, (aside from lowering the image fidelity further)? I think itu2019d be a drop in the ocean, even for those with the worst connections, and I firmly believe this implementation is futile and counterproductive.nnNevertheless the overwhelming negative feedback this proposal will get again, was AVIF considered? How often will we chase u201cimprovingu201d compression formats in the future? How much storage will go to waste (by) then? Why arenu2019t we teaching people to upload in WebP instead of JPEG? Wasnu2019t the image upload resolution already limited in WP 5.4 (IIRC)? Isnu2019t srcset already improving performance tremendously?","contentFiltered":"

How much weight does a typical site lose serving Googleu2019s WebP over JPEG, (aside from lowering the image fidelity further)? I think itu2019d be a drop in the ocean, even for those with the worst connections, and I firmly believe this implementation is futile and counterproductive.

n

Nevertheless the overwhelming negative feedback this proposal will get again, was AVIF considered? How often will we chase u201cimprovingu201d compression formats in the future? How much storage will go to waste (by) then? Why arenu2019t we teaching people to upload in WebP instead of JPEG? Wasnu2019t the image upload resolution already limited in WP 5.4 (IIRC)? Isnu2019t srcset already improving performance tremendously?

n","permalink":"https://make.wordpress.org/core/2022/06/30/plan-for-adding-webp-multiple-mime-support-for-images/#comment-43276","unixtime":1656624920,"loginRedirectURL":"https://login.wordpress.org/?redirect_to=https%3A%2F%2Fmake.wordpress.org%2Fcore%2F2022%2F06%2F30%2Fplan-for-adding-webp-multiple-mime-support-for-images%2F%23comment-43276&locale=en_US","approved":true,"isTrashed":false,"prevDeleted":"","editURL":null,"depth":1,"commentDropdownActions":"","commentFooterActions":"

","commentTrashedActions":"

","mentions":[],"mentionContext":"","commentCreated":"1656624920","hasChildren":false,"userLogin":"Cybr","userNicename":"cybr"},{"type":"comment","id":"43277","postID":"97231","postTitleRaw":"Plan for adding WebP & multiple MIME support for images","cssClasses":"comment byuser comment-author-jorbin even thread-odd thread-alt depth-1","parentID":"0","contentRaw":"Very excited that this important performance improvement is going to make its way to core and the team isn't chasing things like AVIF that aren't realistic for today. Thank you for preparing this. I am in strong support overall, I do have two questions on specifics: nn> Providing a tiny (355 bytes uncompressed) JavaScript snippet that detects browsers that lack WebP support and loads JPEGs instead nnWould there be any benefit to consolidating this with the emoji detection script or would that be more work than is necessary with minimal benefit? nn> Custom image sizes will initially have to opt in to receive automatically generated WebP versions, or opt out if they are exclusively used for special cases where WebP is not beneficial or supported.nnWill there be a way to opt all image sizes in, or is the intent to do this on an image size by image size basis?","contentFiltered":"

Very excited that this important performance improvement is going to make its way to core and the team isnu2019t chasing things like AVIF that arenu2019t realistic for today. Thank you for preparing this. I am in strong support overall, I do have two questions on specifics:

Providing a tiny (355 bytes uncompressed) JavaScript snippet that detects browsers that lack WebP support and loads JPEGs instead

n

Would there be any benefit to consolidating this with the emoji detection script or would that be more work than is necessary with minimal benefit?

Custom image sizes will initially have to opt in to receive automatically generated WebP versions, or opt out if they are exclusively used for special cases where WebP is not beneficial or supported.

n

Will there be a way to opt all image sizes in, or is the intent to do this on an image size by image size basis?

n","permalink":"https://make.wordpress.org/core/2022/06/30/plan-for-adding-webp-multiple-mime-support-for-images/#comment-43277","unixtime":1656625310,"loginRedirectURL":"https://login.wordpress.org/?redirect_to=https%3A%2F%2Fmake.wordpress.org%2Fcore%2F2022%2F06%2F30%2Fplan-for-adding-webp-multiple-mime-support-for-images%2F%23comment-43277&locale=en_US","approved":true,"isTrashed":false,"prevDeleted":"","editURL":null,"depth":1,"commentDropdownActions":"","commentFooterActions":"

","commentTrashedActions":"

","mentions":[],"mentionContext":"","commentCreated":"1656625310","hasChildren":false,"userLogin":"jorbin","userNicename":"jorbin"},{"type":"comment","id":"43278","postID":"97231","postTitleRaw":"Plan for adding WebP & multiple MIME support for images","cssClasses":"comment byuser comment-author-jb510 odd alt thread-even depth-1","parentID":"0","contentRaw":"I feel this is still missing the point about the impact to storage on large sites and user experience on all sites. nnStorage - nOne can't simply say it's OK because "the vast majority of sites (> 86%) would be unaffected". First, 14% is terms of WordPress is a lot. We somehow need to keep supporting the 2.8% of sites still running PHP 5.6, but 14% isn't significant? nnOne needs to consider here not just IF, but HOW this 14% of sites will be affected, and not just today, but in the future as well. Will sites just have to smoothly upgrade storage, or will they run out of disk space and crash? Or backups suddenly start failing? nnFurther, the large sites most likely to be affected aren't on web hosts with 1000s of websites, they are on dedicated/private cloud servers. WP core needs to stop what seems like a general policy ignoring "enterprise users" like they don't matter.nnAgain, as I've said before, I'm 100% on board with WebP support in core. I just can't ignore the "automatically generate WebP for all existing uploads" and the diasterous impact that would have on dozens of our past and current clients with 100s of GB of media assets. nnThis feature absolutely needs to be an "opt-in" toggle on existing sites. That's all, just make it default to "on" for new sites and opt-in on existing sites. One checkbox on the media settings page. Heck even encourage folks to turn it on on the splash screen when they upgrade core through the dashboard, just not by default.nnUser Experience - the negative impact of even MORE thumbnails (many needlessly and never to be used) being generated when media is uploaded was brought up. In testing, it doubled the wait time after upload. Usability from an author's perspective needs to be considered here and I continue to argue that generating thumbnails needs to be moved into a background non-blocking process (ie. Shiny thumbnails). nnWebP Compatibility - sounds like a non-issue, or at least one with plenty of solutions. I do question what is going to happen in 2-3 years when OG consumers do come to widely support webp and those image sizes weren't generated when they normal would have been. Are we later going to go back and "detect" if they're missing and generate them then?","contentFiltered":"

I feel this is still missing the point about the impact to storage on large sites and user experience on all sites.

n

Storage u2013
nOne canu2019t simply say itu2019s OK because u201cthe vast majority of sites (> 86%) would be unaffectedu201d. First, 14% is terms of WordPress is a lot. We somehow need to keep supporting the 2.8% of sites still running PHP 5.6, but 14% isnu2019t significant?

n

One needs to consider here not just IF, but HOW this 14% of sites will be affected, and not just today, but in the future as well. Will sites just have to smoothly upgrade storage, or will they run out of disk space and crash? Or backups suddenly start failing?

n

Further, the large sites most likely to be affected arenu2019t on web hosts with 1000s of websites, they are on dedicated/private cloud servers. WP core needs to stop what seems like a general policy ignoring u201centerprise usersu201d like they donu2019t matter.

n

Again, as Iu2019ve said before, Iu2019m 100% on board with WebP support in core. I just canu2019t ignore the u201cautomatically generate WebP for all existing uploadsu201d and the diasterous impact that would have on dozens of our past and current clients with 100s of GB of media assets.

n

This feature absolutely needs to be an u201copt-inu201d toggle on existing sites. Thatu2019s all, just make it default to u201conu201d for new sites and opt-in on existing sites. One checkbox on the media settings page. Heck even encourage folks to turn it on on the splash screen when they upgrade core through the dashboard, just not by default.

n

User Experience u2013 the negative impact of even MORE thumbnails (many needlessly and never to be used) being generated when media is uploaded was brought up. In testing, it doubled the wait time after upload. Usability from an authoru2019s perspective needs to be considered here and I continue to argue that generating thumbnails needs to be moved into a background non-blocking process (ie. Shiny thumbnails).

n

WebP Compatibility u2013 sounds like a non-issue, or at least one with plenty of solutions. I do question what is going to happen in 2-3 years when OG consumers do come to widely support webp and those image sizes werenu2019t generated when they normal would have been. Are we later going to go back and u201cdetectu201d if theyu2019re missing and generate them then?

n","permalink":"https://make.wordpress.org/core/2022/06/30/plan-for-adding-webp-multiple-mime-support-for-images/#comment-43278","unixtime":1656643223,"loginRedirectURL":"https://login.wordpress.org/?redirect_to=https%3A%2F%2Fmake.wordpress.org%2Fcore%2F2022%2F06%2F30%2Fplan-for-adding-webp-multiple-mime-support-for-images%2F%23comment-43278&locale=en_US","approved":true,"isTrashed":false,"prevDeleted":"","editURL":null,"depth":1,"commentDropdownActions":"","commentFooterActions":"

","commentTrashedActions":"

","mentions":[],"mentionContext":"","commentCreated":"1656643223","hasChildren":false,"userLogin":"jb510","userNicename":"jb510"},{"type":"comment","id":"43280","postID":"97231","postTitleRaw":"Plan for adding WebP & multiple MIME support for images","cssClasses":"comment byuser comment-author-mte90 even thread-odd thread-alt depth-1","parentID":"0","contentRaw":"I have just one question, why use a JS polyfill to switch to webp files instead of a htaccess rule (as many plugins does)?nMaybe because it is an issue on the nginx server? for those it is possible to update the config rules.nnIn this way it isn't something to be handled by the browser but from server side providing the better image format.","contentFiltered":"

I have just one question, why use a JS polyfill to switch to webp files instead of a htaccess rule (as many plugins does)?
nMaybe because it is an issue on the nginx server? for those it is possible to update the config rules.

n

In this way it isnu2019t something to be handled by the browser but from server side providing the better image format.

n","permalink":"https://make.wordpress.org/core/2022/06/30/plan-for-adding-webp-multiple-mime-support-for-images/#comment-43280","unixtime":1656660963,"loginRedirectURL":"https://login.wordpress.org/?redirect_to=https%3A%2F%2Fmake.wordpress.org%2Fcore%2F2022%2F06%2F30%2Fplan-for-adding-webp-multiple-mime-support-for-images%2F%23comment-43280&locale=en_US","approved":true,"isTrashed":false,"prevDeleted":"","editURL":null,"depth":1,"commentDropdownActions":"","commentFooterActions":"

","commentTrashedActions":"

","mentions":[],"mentionContext":"","commentCreated":"1656660963","hasChildren":false,"userLogin":"Mte90","userNicename":"mte90"},{"type":"comment","id":"43281","postID":"97231","postTitleRaw":"Plan for adding WebP & multiple MIME support for images","cssClasses":"comment byuser comment-author-ahortin odd alt depth-2","parentID":"43274","contentRaw":"ud83dudc46What Luke said. There needs to be a filter to completely disable this. I have some sites with a ton of images. I don't want any of them being regenerated, and I have no interest in using webp images on my site.","contentFiltered":"

ud83dudc46What Luke said. There needs to be a filter to completely disable this. I have some sites with a ton of images. I donu2019t want any of them being regenerated, and I have no interest in using webp images on my site.

n","permalink":"https://make.wordpress.org/core/2022/06/30/plan-for-adding-webp-multiple-mime-support-for-images/#comment-43281","unixtime":1656661849,"loginRedirectURL":"https://login.wordpress.org/?redirect_to=https%3A%2F%2Fmake.wordpress.org%2Fcore%2F2022%2F06%2F30%2Fplan-for-adding-webp-multiple-mime-support-for-images%2F%23comment-43281&locale=en_US","approved":true,"isTrashed":false,"prevDeleted":"","editURL":null,"depth":2,"commentDropdownActions":"","commentFooterActions":"

","commentTrashedActions":"

","mentions":[],"mentionContext":"","commentCreated":"1656661849","hasChildren":false,"userLogin":"ahortin","userNicename":"ahortin"}],"postFormat":"standard","postMeta":{"isSticky":false},"postTerms":{"category":[{"label":"General","count":1956,"link":"https://make.wordpress.org/core/category/general/"},{"label":"Initiatives","count":32,"link":"https://make.wordpress.org/core/category/initiatives/"}],"post_tag":[{"label":"core-images","count":8,"link":"https://make.wordpress.org/core/tag/core-images/"},{"label":"media","count":88,"link":"https://make.wordpress.org/core/tag/media/"},{"label":"performance","count":91,"link":"https://make.wordpress.org/core/tag/performance/"}],"post_format":[]},"pluginData":[],"isPage":false,"mentions":[],"mentionContext":"","isTrashed":false,"userLogin":"adamsilverstein","userNicename":"adamsilverstein"}]

Leave a Reply

Your email address will not be published. Required fields are marked *