Make optimized version of original image size, never load original image.
Opened this issue · 9 comments
Related to #6177 and #6131 and #11821 . Filed as separate issue because #6177 is getting too big.
Problem
If a user uploads an unoptimized image, maybe directly from a digital camera, that image file may end up being sent to the visitor browser causing a significant performance hit. For example, this happens when the viewport or displayed width of an image matches or exceeds the original uploaded image width as the original image is the largest image in the srcset attribute array.
Solution
- Always create a new optimized version of the original image matching the original dimensions of the uploaded image.
- Add the optimized version of the original image as the largest image file available in
srcsetarray. - Never load the original uploaded image unless explicitly requested by user.
- Add new option to "link to" option in images to point at optimized version of original image, and a warning/similar to the option to link to actual original image to avoid site admins loading original images into things like lightboxes.
See also: https://core.trac.wordpress.org/ticket/37840
Not sure if this is better tracked here or only in Trac, but either way it's an interesting idea.
@chrisvanpatten Much of this is Gutenberg-related as Gutenberg changes the image management and display modalities significantly.
@mor10 Definitely agree that it's an issue that Gutenberg magnifies, I'm just not sure it's something where the fix would be made within the Gutenberg project — it would need to be a core patch, wouldn't it? It's an issue no matter which editor you use, or even if you upload outside of an editor (e.g. from the Add New Media screen, or programmatically via media_sideload_image).
Totally makes sense to have a tracking ticket here, but I think it's worth clarifying where the fix would be made :)
The fix needs to happen both in core and Gutenberg. #6177 is already looking at the srcset attribute, and even without core changes, much of this can be resolved within the scope of Gutenberg image handling.
I also agree with @chrisvanpatten that this should be handled primarily via WP#37840. The image creation and srcset generation happens outside of Gutenberg.
Sure. But it has to be done in conjunction with Gutenberg, and should be handled before merge/5.0 as wide images suddenly makes the situation of original size images being used by browsers a common occurrence. See WordPress/twentynineteen#50 (comment) for a concrete example of why this is a significant issue.
@mor10 I see this has issue has been stale and inactive for a long time and has other closed issues mentioning it. Is this issue still relevant or can this be closed?
This issue is still relevant and it still exists; there is a core ticket for this at https://core.trac.wordpress.org/ticket/37840 as well.