September 17, 2019
1) Page View (gtm.js)
2) DOM Ready (gtm.dom)
3) Window Loaded (gtm.load)
Their sequence is exactly the following: gtm.js -> gtm.dom -> gtm.load. Let’s take a look at them in more detail:
Page View: This is the earliest event which is sent by Google Tag Manager. It fires at the precise moment when the Google Tag Manager container is loaded.
When to Use: As stated in the GTM help article:
Use this option if you only need data generated from page impressions.
However, please keep in mind that “page impression”, in this case, only means that the Tag Manager container has loaded and can obtain basic information about the page (including the data layer variables, which are initialized above the container snippet).
DOM Ready: This event means that the browser has constructed the full page and all necessary information can be parsed from the DOM.
The DOM is an object-based representation of the source HTML document in the form of a so-called “node tree”. A great description of the DOM can be found here:
It is so-called because it can be thought of as a tree with a single parent stem that branches out into several child branches, each which may have leaves. In this case, the parent "stem" is the root <html> element, the child "branches" are the nested elements, and the "leaves" are the content within the elements.
When to Use: Tags based on the gtm.dom event should be used when it’s necessary to obtain some important information rendered on the page. For example, if you need to scrap some information from the page, you will be able to do this only when it’s available. If you use a trigger which relies on the gtm.js, all the necessary information could remain invisible to the GTM.
When to Use: A trigger of this type is useful when you want to fire specific triggers, but only when the page is already loaded. For example, it can be an option for screen recording/heatmap software. It can also be useful if you are planning to use some custom HTML tags and don’t want them to interrupt the page load process.