title: Where is the ideal place to load javascripts in html?
body: <p>I understand inline javascripts scattered through html code like the following example is bad</p>
  
  <pre><code>&lt;html&gt;
    &lt;head&gt;
    &lt;/head&gt;
    &lt;body&gt;
       &lt;p&gt; Foo &lt;script&gt;&lt;/script&gt;&lt;/p&gt;
    &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>However, after coding for a while, understanding that loading Javascripts at the end of the document is the best way to go. I do see a lot of the sites that conform to loading scripts at the end of their document, do so in the following manner :</p>
  
  <pre><code>&lt;html&gt;
    &lt;head&gt;
    &lt;/head&gt;
    &lt;body&gt;
       &lt;p&gt; Foo &lt;/p&gt;
       &lt;script&gt;&lt;/script&gt;
    &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>What is not made clear, is why not :</p>
  
  <pre><code>&lt;html&gt;
    &lt;head&gt;
    &lt;/head&gt;
    &lt;body&gt;
       &lt;p&gt; Foo &lt;/p&gt;
    &lt;/body&gt;
    &lt;script&gt;&lt;/script&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>.. as this is outside the body tag which means that the body (in theory) can process faster and still load your scripts before finalizing on <code>&lt;/html&gt;</code>.</p>
  
  <p>Or even this :</p>
  
  <pre><code>&lt;html&gt;
    &lt;head&gt;
    &lt;/head&gt;
    &lt;body&gt;
       &lt;p&gt; Foo &lt;/p&gt;
    &lt;/body&gt;
  &lt;/html&gt;
  &lt;script&gt;&lt;/script&gt;
  </code></pre>
  
  <p>Each variation will have (in theory) different performance results, and/or may break functionality in the page depending on the script contents of course.</p>
  
  <p>Of the above formats, which one is the ideal place to load javascripts that would have the highest performance gain without breaking html ?</p>