Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <h2>In General</h2> <p>Putting code just before <code>&lt;/body&gt;</code> should always be the aim. </p> <p>Its highly recommended, as the download of scripts (if requesting external JavaScript files) blocks parallel downloading (i.e. whilst a script is downloading, nothing else - be it another script or an image for example - can be downloaded at the same time).</p> <p>The only time you should have an issue with this, is in something like a poor CMS system where you need to have jQuery in-place in the <code>&lt;head&gt;</code> in order for some of its scripts to work.</p> <h2>Using inline JavaScript</h2> <ol> <li><p>Adding inline JavaScript (or inline CSS code) to a page is generally <a href="http://css.dzone.com/news/why-inline-css-and-javascript-" rel="nofollow">considered bad practice</a> as, for one, its a merging of concerns (i.e. you no longer have true separation between HTML/CSS/JS).</p></li> <li><p>I cannot think of a negative performance issue if you did have all your code inlined - indeed Google use this as a practice (they load all their JavaScript in a bit comment (so that it isn't parsed) and then <code>eval()</code> elements of this blob of "text" as and when they need to.</p></li> <li><p>I would note however, that its unlikely nowadays that you'll have many pages that don't at some point have a requirement on at least one external JavaScript file (be that JQuery, Mootools, Underscore of Backbone). In which case, as you will always have at least one external file (unless you're going to Google route), then you might as well put both external references AND inline code together... at the bottom. Creating consistency.</p></li> </ol> <h2>References</h2> <ul> <li><a href="http://developer.yahoo.com/performance/rules.html#js_bottom" rel="nofollow">Yahoo Developer Network best practices</a></li> <li><a href="http://code.google.com/speed/page-speed/docs/payload.html#DeferLoadingJS" rel="nofollow">Google Page Speed - Defer the loading of JavaScript</a></li> </ul>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload