Consequences javascript can have [removed] in the code?

后端 未结 1 2031
情话喂你
情话喂你 2021-01-27 14:25

The question is about this article: https://www.html5rocks.com/en/tutorials/speed/script-loading/

They are saying this:



        
相关标签:
1条回答
  • 2021-01-27 15:10

    I think the quote is correct, if not fully complete. Rendering is indeed blocked, but not directly; rendering depends upon the parser, which is directly blocked until the javascript finishes execution. So you are correct that the real issue is the parser being blocked, although the render is also being blocked (indirectly) due to its dependence on the parser.

    In this code snippet, you can see that the first div is parsed, but not rendered; the second div is never parsed in the snippet because it is waiting for the javascript to finish.

    <div id="test1">SOME HTML</div>
    <script>
    document.write( 'bla' );
    
    var parsedDiv = document.getElementById("test1");
    alert(parsedDiv.tagName+": "+parsedDiv.textContent);
    
    // Synchronous delay of 3 seconds
    var timeWhile = new Date().getTime(); 
    while( new Date().getTime() - timeWhile < 3000 ){
       parsedDiv = document.getElementById("test2");
       if(parsedDiv)alert(parsedDiv.tagName+": "+parsedDiv.textContent);
    }
    </script>
    <div id="test2">SOME MORE HTML</div>

    0 讨论(0)
提交回复
热议问题