Speed: Avoid render-blocking JavaScript

[delisma]

Describe the bug
External JavaScript should be included on pages in a way that doesn't block page rendering. A <script src="..."> tag will block HTML rendering until the JavaScript file specified is fetched and the contents of the file has finished executing. Inline JavaScript also blocks rendering until execution is complete.

To Reproduce
satelliteLib-c2082deaf69c358c641c5eb20f94b615dd606662.js
assets.adobedtm.com/caacec67651710193d2331efef325107c23a0145/satelliteLib-c2082deaf69c358c641c5eb20f94b615dd606662.js

Expected behavior
We can stop <script> tags from blocking rendering by placing them directly before the closing </body> tag. Alternatively, for external JavaScript files we can load the script in the background using either:

1. <script defer src="...">, which delays script execution until the DOM is ready or
2. <script async src="...">, which will execute the script as soon as it has loaded.

Note that defer scripts execute in the order they appear on the page like inline scripts. However, async scripts execute whenever they have downloaded so their execution order can change. This difference is important when scripts have dependencies.