InfoTales

JavaScript files have become important part of most of the web. Placement of js file can play important role in front end performance. If you care about performance for you visitors, you must place JavaScript files properly.

Browsers allow parallel connections to a single hostname. This allows files to download faster in parallel and very helpful for web application performance. When JavaScript file is called browsers halts the parallel connections to all hosts. This is because JavaScript can alter the document dom with document.write().

This can badly hurt the front end performance of a web application. To avoid this all calls to JavaScript files should be moved to bottom of the page, just before end to BODY tag.

If it is not possible to move JavaScript calls to bottom, one should use DEFER attribute when calling script. Example code for this is
<script src="script.js" type="text/javascript" defer="defer"></script>
Here defer tells that JavaScript does not contain any document.write() and browser should continue rendering. Problem with defer is that FireFox does not support it, Internet Explorer supports the defer but not to as desired. Still its batter to use it.

For faster page loadeds its recommended that JavaScript should be moved at bottom of the page, so parallel downloads are not blocked by JavaScript files.

This post is part of our “Web Application Performance“. You can find more exciting post to improve performance of a web application in Web Application Performance category.