Saturday, May 16, 2015

Blocking nature of JavaScript

When a HTML script tag is encountered in the HTML document, the browser will block all other activities until the script is downloaded (if it is an external link) and executed.  The reason is the script may change the html document (DOM) and thus changes the rendering of the change and behaviour of the page.

Therefore, it is desirable to place Javascript at the latter part of the tree to avoid long wait for user.  If the Javascipt is place at the front of the HTML document (such at the section), user may see a blank white page delay when the page is being loaded.

When there are successive Javascript files specified in the page, the second script file will be loaded after the first one has completed loading and execution.  If an inline script is placed after tag, the browser will also be blocked until the css file referred to by the link is download.  This is to ensure the inline script has the latest layout information to work with if required.

No comments: