fix: cap srcset against naturalWidth instead of currentWidth#1036
Open
fuleinist wants to merge 1 commit intoCodeinwp:developmentfrom
Open
fix: cap srcset against naturalWidth instead of currentWidth#1036fuleinist wants to merge 1 commit intoCodeinwp:developmentfrom
fuleinist wants to merge 1 commit intoCodeinwp:developmentfrom
Conversation
The srcset detector was capping 1x DPR variants at the CSS-rendered width at profiling time, not the image's natural pixel width. This caused blurry images on viewports wider than the profiling screen. Before: A 2560px image profiled on 1440px screen would only generate srcset entries up to 1440w for 1x DPR, causing upscaling blur on larger screens. After: The srcset is capped at the image's naturalWidth, ensuring all available resolution is used regardless of profiling viewport. Fixes Codeinwp#1030
6 tasks
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
Fixes #1030 - srcset capped at profiling container width, causing blurry images on wider viewports.
Problem
When Optimole's JS page profiler measures an image on a desktop screen (e.g. 1440px wide), it stores srcset entries capped at that container width. Visitors on wider screens (e.g. 1750px) then receive a srcset whose largest 1x entry is 1440px, causing visible blur.
Root Cause
In _generateResponsiveSizes(), the condition was capping against currentWidth (CSS-rendered size) instead of naturalWidth (actual image pixel width).
Fix
Changed the condition to cap against naturalWidth instead, ensuring 1x srcset variants are generated for all breakpoints up to the image's actual pixel width.
Files Changed