Improve image load performance with DMC Presets in AEM Dynamic Media
This article explains how to address slow image loading performance on pages that use DMC Presets in Adobe Experience Manager (AEM) Dynamic Media by optimizing presets and implementing best practices.
Description description
Environment
- Adobe Experience Manager (AEM) Dynamic Media
- DMC Presets
Issue/Symptoms
- Pages displaying multiple images with DMC Presets in AEM Dynamic Media may experience slow image load times.
- This can impact user experience, particularly when images are large or numerous.
- The issue is commonly observed on image library pages where images take a long time to appear.
- No error messages are typically shown.
Cause
Slow image loading can occur when a page requests multiple large images using DMC Presets, especially on image library pages where many images are loaded at once.
Resolution resolution
Follow the steps below to resolve the issue:
- Review the number and size of images being loaded on the affected page. Loading many large images simultaneously can slow down performance.
- Optimize your DMC Presets to generate images that are appropriately sized for their display context. Avoid using high resolutions for thumbnails or preview images.
- Implement lazy loading for images so that only images in the viewport are loaded initially. This reduces the initial page load time.
- Check network performance and latency between your site and the Dynamic Media servers, as network delays can contribute to slow image loading.
- Use browser developer tools to analyze the sequence of image requests and identify any bottlenecks or slow responses from the Dynamic Media service.
- If the issue persists after optimization, collect additional diagnostics such as network traces and browser console logs.
To verify, reload the affected page and confirm that images load more quickly after making these optimizations.
Related Reading
recommendation-more-help
experience-cloud-kcs-help-kbarticles