title: Preload font-awesome
body: <p>I am trying to pre-load font-awesome to improve my page load times:</p>
  
  <pre><code>&lt;link rel="preload" as="style" href="//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css"/&gt;
  &lt;link rel="preload" as="font" type="font/woff2" href="//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.woff2?v=4.3.0"/&gt;
  </code></pre>
  
  <p>However...Chrome seems to download the font twice and reports </p>
  
  <blockquote>
    <p>The resource
    <a href="http://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.woff2?v=4.3.0" rel="noreferrer">http://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.woff2?v=4.3.0</a>
    was preloaded using link preload but not used within a few seconds
    from the window's load event. Please make sure it wasn't preloaded for
    nothing.</p>
  </blockquote>
  
  <p><a href="https://i.stack.imgur.com/iDWaX.png" rel="noreferrer"><img src="https://i.stack.imgur.com/iDWaX.png" alt="enter image description here"></a>
  How do I get this to work?</p>