title: Is CSSOM created only when the html page has link for external sheet or is it even created when we have inline styling or internal css?
body: <p>I have gone through critical render path and its importance in making the page load faster. As I understand, the construction of DOM tree and CSSOM based tree happen before page could be rendered. The html parser also moves top down coming across tags.
  Most important take away is that script execution does two things:</p>
  <ol>
  <li>blocks parser ( assuming async or defer is not used)</li>
  <li>pauses for CSSOM tree construction first</li>
  </ol>
  <p>Thus whole process of DOM tree construction and java script execution is stalled for CSSOM based tree construction.</p>
  <p>Also we know, the css styling can be done in following three ways-</p>
  <ol>
  <li>External css as a link under  </li>
  <li>internal css defined inside   under </li>
  <li>inline css defined using style attribute for every element tag wherever styling is required.</li>
  </ol>
  <p>The problem is that both for external css and internal css we can be sure that it is inside head tag and therefore it is all likely that before parser hits a script tag, it has already gone across the styling part and therefore when script execution has to pause for CSSOM construction, it can happen smoothly. Even if  is also included inside  along with styling, we can first include  tag ( for external sheet) or  tag ( for internal css) and then use that  tag.</p>
  <p>But what if inline-styling is used? Because in that case if parser comes across the  tag, the script execution may not pause for any CSSOM construction as styles being inline with elements, will come later in the page after the parser crosses  tag . Thus the script which normally would have waited for CSSOM tree to be built first, will continue its execution as it concludes that there is no styling involved.</p>
  <p>So I ask -</p>
  <ol>
  <li><p>Regarding CSSOM based tree construction, does it happen only when external stylesheet is included or happen even when internal or inline css is used?</p>
  </li>
  <li><p>Is CSSOM tree constructed even when inline styling is used and if Yes, then is it required to use the script tag at the very bottom so that all inline styling has already been parsed by the browser before script execution?</p>
  </li>
  </ol>