title: Chrome not animating until css are loaded
body: <p>In my head I include very small css file for loading animation. I am downloading large Angular2 application, and I want to display loading.
  What I experience is that animation does not start until all css are loaded from server.</p>
  
  <pre><code>&lt;link rel="stylesheet" href="~/dist/load.css" /&gt;
  &lt;link rel="stylesheet" href="~/dist/vendor.css" /&gt;
  </code></pre>
  
  <p>I tried to load <code>vendor.css</code> with <code>async</code>, <code>defer</code>, <code>async defer</code>. Tried to place it before <code>&lt;/body&gt;</code> tag. I even try to replace animation with gif. Same thing, gif is displayed when <code>vendor.css</code> is loaded.<br>
  In network tab in Developer tools I choose Slow 3G. The moment that <code>vendor.css</code> file is loaded animation starts.
  If I remove <code>vendor.css</code> from html animation starts immediately.</p>
  
  <p>How can I start animation before other css file is loaded?</p>