Loading Order Of A Pre-Loaded Extension

[jonathan_chan]

My utag.js is added to the end of my body tag. I have an extension scoped to 'Pre-Loaded'. Will this extension still run before the DOM is ready?

[brian_kranson · Accepted solution]

@jonathan_chan

The answer to this question is maybe.  In my tests, it did not, however you should test on your own website to see for yourself.

You can right click on any image below and open in a new tab to make it larger.

Here is some sample code you can copy/paste into a preloader extension:

Make sure you delete or deactiveate this pre loader extension before you publish to production.  There is no need for this test code to make it to your production website.

if(window.console && window.console.log){
  var d = new Date();
  console.log("inside pre loader");
  console.log(console.log(d.getHours() + ":" + d.getMinutes() + ":" + d.getSeconds() + "." + d.getMilliseconds()));
  if(window.jQuery){
    jQuery(document).ready(function(){
      var d = new Date();
      console.log("document ready (DOM Ready)")
      console.log(console.log(d.getHours() + ":" + d.getMinutes() + ":" + d.getSeconds() + "." + d.getMilliseconds()));
    });
    jQuery(window).load(function(){
      var d = new Date();
      console.log("window load (DOM Complete)")
      console.log(console.log(d.getHours() + ":" + d.getMinutes() + ":" + d.getSeconds() + "." + d.getMilliseconds()));
    });
  }else{
    console.log('you need jQuery to run this code');
  }
}

And now let's test.  First here is the code for our sample website with utag.js at the bottom of the body tag:

Now lets load the sample page and see the console outputs:

It is important to acknowledge that the hard coded DOM Ready listener will happen as soon as the browser raises the DOM Ready event.  However the Tealium DOM Ready listner will happen only after the utag.js has been downloaded from the internet and DOM Ready has happened. This is dependent on so many other variables that it is not really possible to speak to your specific situation within this thread.  

Last, just for fun, lets take a moment to view where the pre loader extension code resides within utag.js:

Please let us know if this helps.

Brian

[jonathan_chan]

Thank you Brian. Your reply was very useful!