javascript - script element with async attribute still block browser render? -
i use cuzillion tool build page:
<head> <script async></script> </head> <body> <img /> <img /> <img /> </body>
there 1 script element in head, async attribute , 2 second delay, 3 second execute.
but page load timeline in chrome is:
when script executing, still block browser render process?
but why? shouldn't execute asynchronously?
however doesn't block parser:
the execution of script blocks parsing, rendering, , execution of other scripts in same tab. attribute async
not change that.
the thing async
tell browser script should fetched (assuming it's remote file) without blocking activities.
after script downloaded, script starts executing @ next available opportunity (that is, right after current script, if any, finishes running; new script won't, of course, interrupt running script). once happens, rendering blocked. so, fast web server, downloading happens fast async
makes no difference @ all.
if don't want scripts pause rendering, use defer
attribute instead of async
. delay execution of script until after document loaded.
more on here.
Comments
Post a Comment