async/defer attributes and DOM construction

1. script with no attribute

Result

Hello World!

Markup

<p id="result">
    Hello
    <script src="A.js"></script>
    <script src="B.js"></script>
    <script src="C.js"></script>
    World!
</p>

DOM elements and Events

Description

Loading each script will be started at about the same time but the first script (A.js) will block the execution of subsequent scripts (B.js, C.js) until a browser has completed to execute the first script. This browser’s behavior causes blocking HTML parsing (and also DOM construction) and page rendering. As a consequence, firing DOMContentLoaded will be blocked and displaying the second half of the page will be delayed.