简体   繁体   中英

Lazy-Loading/Delay X Amount of JavaScript

TLDR Version

Pretty simple question, what is the best method to lazy-load or delay low priority JavaScript? Considering that this could be anything, from Google Analytics, Optimizely, Test and Target, to Custom Code. All loaded with Adobe DTM.

Longer Version

We have analysed our traffic and found slow loading times cause less sales, no surprise there. Unfortunately, a lot of the JavaScript is bloated by a separate department and it's only getting worse with loading time coming in above 10 seconds .

The evil side of me wants to place a page load event and setTimeout on the Adobe DTM script to delay the code until much later. But this will have a side effect of page load events in the vendor's code not executing properly.

Best solution I have so far today, is to add a page load event on the page to load Adobe DTM by appending a <script> element to the <body> tag. Essentially, we need the application's code to load first and the marketing code should load in the background without impacting the website.

Can anyone provide a better solution?

Check your page organization - make sure low priority scripts are loaded at the end of the body, not in the head.

Add a defer attribute to the script tags of low priority scripts.

Be sure you have compression enabled for JavaScript files (web server configuration).

Leverage browser caching by setting far-future expiration dates for files that don't change often, append a version or timestamp to the JavaScript files to ensure updates are properly handled.

If possible, minify the JavaScript.

If possible, reduce the number of JavaScript files by combining them into a single file.

Strive to ensure only the JavaScript required for each page is requested.

Please note as per the documentation: https://marketing.adobe.com/resources/help/en_US/dtm/deployment.html That if the DTM embed code is not implemented in the prescribed manner then technically it is no longer a supported implementation.

Rudi Shumpert

Sr. Architect & Evangelist

Adobe Marketing Cloud Core Services


DTM Blog Posts: http://blogs.adobe.com/digitalmarketing/tag/dynamic-tag-management/

Full DTM Demo..no slides…just live demo: https://outv.omniture.com/play/?v=B5ODcybDozpBfRAARKiVrQ7V9lMtrD1C DTM Help & Documentation: https://marketing.adobe.com/resources/help/en_US/dtm/

Marketing Cloud ID Service: https://marketing.adobe.com/resources/help/en_US/mcvid/

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM