AEM assets preload | Community
Skip to main content
M
Mohammed-Skouti
Level 3
October 9, 2024
Solved

AEM assets preload

  • October 9, 2024
  • 2 replies
  • 1077 views

How to optimize clientlibs generation speed in AEM Core Components using a Sling Model for automatic asset preloading?

I'm looking for best practices to speed up clientlibs generation in AEM when using Core Components. Specifically, I want to:

  1. Optimize the clientlibs load time.
  2. Automatically generate preload links for critical assets (CSS, JS, fonts, etc.) using a Sling Model.
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 h_kataria

The js include essentially generate script tag which itself doesn't support preload attribute. You can check if https://developer.mozilla.org/en-US/docs/Web/HTML/Element/script#fetchpriority is helpful otherwise you can take a look at their implementation https://github.com/wcm-io/io.wcm.wcm.ui.clientlibs/tree/develop and enhance it as per your requirements.
Hope this helps.

2 replies

h_kataria
Community Advisor
h_katariaCommunity Advisor
Community Advisor
October 9, 2024

You can take a look at https://wcm.io/wcm/ui/clientlibs/usage.html which possibly allows preload for stylesheets as well as deferred or async load for js.
Hope this helps.

    M
    Mohammed-SkoutiAuthor
    Level 3
    October 9, 2024

    @h_kataria The extension doesn't include a way to preload scripts

      h_kataria
      Community Advisor
      h_katariaCommunity AdvisorAccepted solution
      Community Advisor
      October 9, 2024

      The js include essentially generate script tag which itself doesn't support preload attribute. You can check if https://developer.mozilla.org/en-US/docs/Web/HTML/Element/script#fetchpriority is helpful otherwise you can take a look at their implementation https://github.com/wcm-io/io.wcm.wcm.ui.clientlibs/tree/develop and enhance it as per your requirements.
      Hope this helps.

        arunpatidar
        Community Advisor
        arunpatidarCommunity Advisor
        Community Advisor
        October 9, 2024

        Hi @mohammed-skouti 
        Aprt from what @h_kataria mentioned.
        You can rely on TTL based browser caching with clientlibs hashing. This will avoid making GET request to CDN for clientlibs 

        Arun Patidar
          Terms & ConditionsAccessibility statement

          Loading footer...