Add Fetch Priority to Product Summary Image #388
Closed
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.
What problem is this solving?
The aim of this change is to enhance the LCP performance metric on search pages for both desktop and mobile devices.
This is achieved by setting the fetchpriority property of Shelf Images, allowing users the freedom to decide the priority they desire.
Motivation
The inclusion of this option aims to provide flexibility and control over loading showcase images. By introducing the ability to define image search priority, users will have the option of deciding whether or not to use their options, adapting loading according to the needs of the context of use.
Proposed Implementation
The 'fetchPriority' property will be an additional option for showcase images. It will accept values that represent search priorities, allowing developers and users to choose between "low", "auto" and "high" image loading priorities.
Conclusion
Adding 'fetchPriority' support to storefront images will provide a flexible and controlled way of handling image loading, improving both performance and user experience.
I am available for any further questions regarding how it is implemented and I am also leaving 2 reports from the lighthouse (mobile) with the impacts of our performance with the prop and what it is currently like.
lighthouse-loja.electrolux.com.br-mobile-atualmente.pdf
lighthouse-loja.electrolux.com.br-mobile-com-a-prop.pdf
How to test it?
Workspace
Screenshots or example usage:
How does this PR make you feel? 🔗