title: Google is wrong about defer?
body: <p>In this post:</p>
  
  <p><a href="https://stackoverflow.com/questions/47012168/why-google-is-using-the-term-render-blocking-javascript">Why google is using the term &quot;Render-Blocking JavaScript&quot;?</a></p>
  
  <p>@jaffa-the-cake is asking in a comment to someone:</p>
  
  <p>"Which piece of documentation do you consider incorrect?"</p>
  
  <p>Let's take for example this documentation:</p>
  
  <p><a href="https://developers.google.com/speed/docs/insights/BlockingJS" rel="nofollow noreferrer">https://developers.google.com/speed/docs/insights/BlockingJS</a></p>
  
  <p>And now let's take for example what they are saying about "defer":</p>
  
  <blockquote>
    <p>The loading and execution of scripts that are not necessary for the initial page render may be deferred until after the initial render or other critical parts of the page have finished loading. Doing so can help reduce resource contention and improve performance.</p>
  </blockquote>
  
  <p>Note that the article is about "Remove Render-Blocking JavaScript", so with the word "may" they mean that you COULD use defer.</p>
  
  <p>With "defer" on a script tag, you will NOT defer "the execution until after the initial render of the page have finished loading". It can be the case, but not necessarily. </p>
  
  <p>"Defer" will defer the execution until after the initial html is in the DOM, but that's something different than "render". The execution will take place after the (preceding) html is in the DOM and before DOMContentLoaded, but that does not mean: "render of the page have finished loading". It would be correct if they would use the term "html parsing of the page have finished".</p>
  
  <p>An example which confirms the theory of above:</p>
  
  <p>INDEX.HTML</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
  &lt;head&gt;
  &lt;meta charset="utf-8" /&gt;
  &lt;title&gt;Test&lt;/title&gt;
  &lt;/head&gt;
  &lt;body&gt;
      Some HTML line and this is above the fold
      &lt;script src="script.js" defer&gt;&lt;/script&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>SCRIPT.JS (from cache!)</p>
  
  <pre><code>// Synchronous delay of 5 seconds
  var timeWhile = new Date().getTime(); 
  while( new Date().getTime() - timeWhile &lt; 5000 );
  </code></pre>
  
  <p>In case the browser will take script.js from cache then "Some HTML line and this is above the fold" will be shown AFTER 5 seconds! So that means the initial render of the page have NOT finished loading yet (while using defer). So in my opinion that means the documentation is incorrect.</p>
  
  <p>p.s. Without script.js from the cache, a browser will have time to finish rendering of the preceding html. The file script.js first has to be downloaded, so that's what gives the browser extra time. With caching, there is less time between "done parsing html" and starting with the "javascript execution", so then there is a chance that "javascript execution" already starts before "finishing rendering of the preceding html". So in case of speed gain, you could even consider in this example to disable caching, so the rendering of the preceding html will be faster.</p>
  
  <p>I have a lot more tests / examples which proves other parts in other documentation (about rendering) of Google are incorrect (in my opinion), but i will keep it clear in this post by using 1 example.</p>
  
  <p>If you are disagree with me, please don't give only a negative reputation, but at least give a comment why you think it's incorrect and which test you did to confirm it. I'm already trying to convince some people at Google that they are incorrect in my opinion, but they are kind of offended by that. Of course i would not say that they are incorrect if i didn't put a lot of time / energy / testing in it and if i would be pretty sure about it. Until now they are saying to me: "consider that the misunderstanding may be yours", so i feel like a small boy "fighting" against a big wall. For me it's not about to get right in the first place, but i see so many people around me (they are already for many years working in IT) struggling with the subject rendering and i can understand it, because the documentation about it is very confusing. That's also why i dived deeper into it, because it was also getting too confusing for me, so i wanted to understand it better.
  And if i am wrong, just convince me with arguments and i am the first who will say i was wrong.</p>