Adobe Experience Manager Sites & More

neo-silicon · 3/15/25

Hi Team,

We are using the below unpkg at customheaderlibs.html

Problem Statement: The dependency is being delivered via UNPKG, a public CDN for npm packages. When it attempts to load and takes longer than expected, it affects the page load time for authors and publishers on the end website. However, if it fails to load, it does not impact the page load time.

Any one faced this issue and how we can overcome and what is best way to deal this type of issue. Kindly suggest

Thanks

narendragandhi · 3/18/25

The GitHub repo link shared above, points to an API - https://html.spec.whatwg.org/multipage/custom-elements.html#custom-elements-api likely your code might be using CustomElements somewhere.

Thanks

Narendra

View solution in original post

PRATHYUSHA_VP · 3/16/25

Hi @neo-silicon

Embedding third-party scripts often cause performance slowdowns in webpages often caused by resources outside the site owner's control. Below are the ways to mitigate the issue -

Load the script using the async or defer attribute to avoid blocking document parsing

<script src="//unpkg.com/@ungap/custom-elements" async>
<script src="//unpkg.com/@ungap/custom-elements" defer>

Use pre-connect for the third party dependencies, like below

<link rel="preconnect" href="//unpkg.com/@ungap/custom-elements"> // verify the browser-support for pre-connect

Implement lazy-loading for these type of scripts, this way users get page content faster and improve LCP and speed metrics

Hope this helps

Thanks

neo-silicon · 3/17/25

Thank you for your reply . custom-elements we are not using in our code repo so we are trying comment this line

narendragandhi · 3/17/25

Hi @neo-silicon , it seems you are using https://github.com/ungap/custom-elements this library in your code for custom elements. Once you verify that all the references have been removed from the code, you would be able to remove this reference as well.

Thanks

Narendra

neo-silicon · 3/17/25

Hi Narendra,

true we are using the below one from that repo code. We dont know why they added in our code

<script src="//unpkg.com/@ungap/custom-elements"></script>

narendragandhi · 3/18/25

The GitHub repo link shared above, points to an API - https://html.spec.whatwg.org/multipage/custom-elements.html#custom-elements-api likely your code might be using CustomElements somewhere.

Thanks

Narendra

giuseppebag · 3/17/25

While CDNs can offer benefits, they introduce dependencies outside your control. If the script isn't critical, consider whether it can be loaded asynchronously or deferred.

To improve the loading of your script and reduce reliance on external CDNs, you can evaluate to utilize AEM's sling-resource approach where you create a dedicated client library for external vendors.

After implementing these changes, you should test the page load time to ensure the script loads efficiently and check for any unintended side effects and make adjustments as necessary.

kautuk_sahni · 4/1/25

@neo-silicon Did you find the suggestions helpful? Please let us know if you need more information. If a response worked, kindly mark it as correct for posterity; alternatively, if you found a solution yourself, we’d appreciate it if you could share it with the community. Thank you!

Adobe Experience Manager Sites & More

UNPKG affect page load time vey badly on end website and author

Kautuk Sahni

Learn

Documentation

Events

Community

Support

Resources

Adobe account

Adobe