The Dynamic Tag Management load order in relation to the JavaScript load order.
The following diagram shows the general page load order.
Red text on the above diagram represents non-sequential activity. Green text represents sequential activity.
The following section discusses how the different JavaScript/third-party tags script options are utilized within the four page-load phases:
Top of Page
<HEAD/>
below DTM library include script if <SCRIPT/>
tags are used, otherwise is injected at top of <BODY/>
<HEAD/>
below DTM include script as JavaScript include <SCRIPT/>
<HEAD/>
below DTM include script as JavaScript include <SCRIPT/>
<SCRIPT/>
in <HEAD>
below DTM library include scriptIFRAME
and does not affect page HTMLBottom of Page
Sequential HTML: Injected after _satellite.pageBottom()
callback script with document.write()
prior to DOMREADY so that there is no destruction of the visible page
Sequential JavaScript global: Injected after _satellite.pageBottom()
as JavaScript include <SCRIPT/>
Sequential JavaScript local: Injected after _satellite.pageBottom()
as JavaScript include <SCRIPT/>
Non-sequential JavaScript: Injected as asynchronous <SCRIPT/>
in <HEAD>
below DTM library include script
Non-sequential HTML: Injected as hidden IFRAME
and does not affect page HTML
DOM Ready
DOMREADY
is active and document.write()
will overwrite the page<HEAD/>
below DTM include script as JavaScript include <SCRIPT/>
<HEAD/>
below DTM include script as JavaScript include <SCRIPT/>
<SCRIPT/>
in <HEAD>
below DTM library include scriptIFRAME
and does not affect page HTMLOnload (window load)
DOMREADY
is active and document.write()
will overwrite the page<HEAD/>
below DTM include script as JavaScript include <SCRIPT/>
<HEAD/>
below DTM include script as JavaScript include <SCRIPT/>
<SCRIPT/>
in <HEAD>
below DTM library include scriptIFRAME
and does not affect page HTMLNon-sequential HTML third-party rules are always placed into iFrames. There is no such thing as asynchronous HTML so Dynamic Tag Management refers to the iFrame functionality with that name.
Even though scripts might be injected into the <HEAD/>
later in the page processing like DOMREADY
and ONLOAD
, scripts will only appear in the proper timing sequence and be either global, local, synchronous, or asynchronous. Also, Dynamic Tag Management checks to make sure that the timing is being handled properly and if DOMREADY
has already occurred, it will not attempt a page-destructive document.write()
. Dynamic Tag Management is diligent about not breaking the visual page if at all possible. For this reason, you might see an “asyc installation” error when the installation might not actually be “async.” It is simply an alert that helps you recognize that the timing on the page is somewhat questionable and that DOMREADY
has fired prior to all of the synchronous scripts loading as they should. If that happens, check to make sure that the pageBottom()
callback is actually in the correct place immediately prior to the </body>
tag. If not then these types of errors can occur.
The Dynamic Tag Management queue processes them in the order listed above but does not distinguish between a JavaScript and an HTML script within the page load phase.
This means that the order of the page load rules in the queue determines the order in which they are de-queued.
A simple way to determine the queue order is to look at _satellite.configurationSettings.pageLoadRules
in the JavaScript console and examine the sequence.
For example, a complete view of the page load rule queue order can be seen by entering the following code into the JavaScript console:
_satellite.each(_satellite.configurationSettings.pageLoadRules,function(i){(i.event=='pagetop')?_satellite.notify(i.event+': '+i.name,1):false})
_satellite.each(_satellite.configurationSettings.pageLoadRules,function(i){(i.event=='pagebottom')?_satellite.notify(i.event+': '+i.name,1):false})
_satellite.each(_satellite.configurationSettings.pageLoadRules,function(i){(i.event=='domready')?_satellite.notify(i.event+': '+i.name,1):false})
_satellite.each(_satellite.configurationSettings.pageLoadRules,function(i){(i.event=='windowload')?_satellite.notify(i.event+': '+i.name,1):false})