On Load Event
When to use it?
Section titled “When to use it?”The On Load Event is particularly useful for scripts like Google Tag Manager, Google Analytics, and any other tracking scripts related to cookies, including those from Hubspot, Hotjar, and various other third-party libraries.
It watches for scripts inside the <head>
or <body>
tags marked with type="text/boostify"
.
These scripts are then activated after a short delay of a few milliseconds or in response to user interactions such as scrolling, mouse movement, touching, or after a predetermined maximum time.
How To use it?
Section titled “How To use it?”Just swap type="text/javascript
for type="text/boostify
<script type="text/boostify" async src="https://www.googletagmanager.com/gtag/js?id=G-{{something}}"></script><script type="text/boostify"> window.dataLayer = window.dataLayer || []; function gtag(){dataLayer.push(arguments);} gtag('js', new Date()); gtag('config', 'G-{{something}}');</script>
Configuration options
Section titled “Configuration options”-
maxTime:
Number
- (600
ms by default) - Specifies the maximum wait time in milliseconds before the scripts are executed automatically. This delay allows for user interaction to potentially trigger script execution sooner. -
eventsHandler
Array
- (['mousemove', 'load', 'scroll', and 'touchstart']
by default ) - A list of event types as strings. These events, when occurred, prompt Boostify to load the specified scripts. -
callback:
function
- An optional callback function that executes after the scripts have been successfully loaded. This function receives an event object detailing the trigger event.
boostify.onload({ maxTime:1200, eventsHandler: ['mousemove','load','scroll','touchstart'] callback: async () =>{ console.log('all scripts with bootext/boostify were executed') }})