Images are not loading in Webp format for Core Image component | Community
Skip to main content
supriya-hande
Level 4
August 8, 2023
Solved

Images are not loading in Webp format for Core Image component

  • August 8, 2023
  • 1 reply
  • 1427 views

Hello All,

 

There is one recommendation in Lighthouse report to load images in webp format. I did some research and I found we can use Web optimised image delivery option from Core Image component design dialog. Below is the ref link:
https://experienceleague.adobe.com/docs/experience-manager-core-components/using/developing/web-optimized-image-delivery.html?lang=en#can-i-use-web-optimized-image-delivery-with-my-own-component%3F

I am able to see webp images are getting loaded for core image component. 

But In our project we have custom image component and we need to extend core v2 image to use Web optimised image delivery option. So I added jcr property to Image component sling:resourceSuperType = core/wcm/components/image/v2/image and we are using fileupload resourceType to add image. See below:

 

I deployed above changes to dev instance(AEM cloud 6.5) and I able to see Web optimised image delivery option in Image design dialog inside templates. I checked this option but when I authored this custom Image component on page, images are not loading in webp format. Anyone have any idea what could be the issue? Or is it related to cloud version?

 

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.
Best answer by Kiran_Vedantam

Hi @supriya-hande 

 

Are you seeing any exception in the log once the image is dropped?

What I would try is:

  1. Create a new proxy component from image V2
  2. Author this new component with the webp to check if it's loading the image

This way we can identify if your custom component is having an issue with its implementation.

 

Thanks,

Kiran Vedantam.

 

1 reply

Kiran_Vedantam
Community Advisor
Kiran_VedantamCommunity AdvisorAccepted solution
Community Advisor
August 9, 2023

Hi @supriya-hande 

 

Are you seeing any exception in the log once the image is dropped?

What I would try is:

  1. Create a new proxy component from image V2
  2. Author this new component with the webp to check if it's loading the image

This way we can identify if your custom component is having an issue with its implementation.

 

Thanks,

Kiran Vedantam.