title: Viewport vs Window Vs Document
body: <p>In the below code,</p>
  
  <pre><code>document.documentElement.clientWidth
     1349
  document.documentElement.clientHeight
     363
  window.innerWidth
     1366
  window.innerHeight
     363
  window.screen.height
     768
  window.screen.width
     1366
  </code></pre>
  
  <p>So, My desktop screen is 1366 px wide and 768 px height.</p>
  
  <p>I learnt that, </p>
  
  <p>viewport dimensions are referred using <code>document.documentElement.clientWidth</code> and <code>document.documentElement.clientHeight</code>.</p>
  
  <p>window dimensions are referred using <code>window.innerWidth</code> and <code>window.innerHeight</code>.</p>
  
  <p>1) What is the difference between viewport and document?</p>
  
  <p>2) when does <em><code>window.onload</code> Vs <code>document.onload</code></em> get invoked?</p>