To answer Omar Wraikat question, the browser needs to pause the parsing whenever it encounters a script tag as it doesn’t know if the requested script is going to change the DOM construction down the line or not. To play safe, the browser downloads it and then later hands it over to the JS engine to execute.

But you can direct the browser to fetch script asynchronously by using async or defer attributes inside the script tag.

<script async src="script.js"></script>
<script defer src="script.js"></script>

async: Browser will go ahead and fetch your script asynchronously while still keep on parsing. But when the script has been downloaded, it pauses the parsing and goes on the execution step.
defer: Browser will go ahead and fetch the file asynchronously while keep on parsing the HTML. The script doesn’t run until the parsing is complete.

Here’s the resource link if you want to read in details: https://developers.google.com/web/fundamentals/performance/optimizing-content-efficiency/loading-third-party-javascript#use_async_or_defer