Why should Tealium utag script be added to the page dynamically?

Question

I have come across tealium utag.js documentation that recommends to include the tag with the following snippet of code. Basically, it creates an async script tag and inserts it before the first script tag of the document.

<script type="text/javascript">
  // some setup needed for Tealium utag.js to work properly
</script>
<!-- Tealium snippet to include utag.js -->
<script type="text/javascript">
  (function(a,b,c,d) {
      a='//tags.tiqcdn.com/utag/ACCOUNT/PROFILE/ENVIRONMENT/utag.js';
      b=document;c='script';d=b.createElement(c);d.src=a;
      d.type='text/java'+c;d.async=true;
      a=b.getElementsByTagName(c)[0];a.parentNode.insertBefore(d,a)})();
</script>

I was wondering if there is any advantage/difference to using this snippet instead of including the script in the DOM directly.

<script type="text/javascript">
  // some setup needed for Tealium utag.js to work properly
</script>
<!-- Include utag.js asynchronously -->
<script type="text/javascript" src="//tags.tiqcdn.com/utag/ACCOUNT/PROFILE/ENVIRONMENT/utag.js" async></script>

Answer 1

The reason would be that the recommended approach is compatible with 100% of browsers. Most modern browsers support the async option, so you are probably safe to use it, but you may have a visitor with an older browser. You probably want to err on the side of caution and make sure you are supporting all users.

https://caniuse.com/script-async