title: HTML font family display delayed after displaying default font family
body: <p>I am having an issue with my web page:</p>
  
  <p>I am using google's font "Source Sans Pro" for my website's text. 
  This is how my html looks like:</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html lang="en"&gt;
  &lt;head&gt;
  &lt;meta charset="UTF-8"&gt;
  &lt;meta name="viewport" content="width=device-width, initial-scale=1.0"&gt;
  &lt;meta http-equiv="X-UA-Compatible" content="ie=edge"&gt;
  &lt;title&gt;Document&lt;/title&gt;
  &lt;link href="https://fonts.googleapis.com/css?family=Source+Sans+Pro&amp;display=swap" rel="stylesheet"&gt;
  &lt;style&gt;
      body {
          font-family: "Source Sans Pro";
          font-size: 45px;
      }
  &lt;/style&gt;
  &lt;/head&gt;
  &lt;body&gt;
  &lt;p&gt;Simply The Best &lt;/p&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>When I display the page, I found the page flash to display the text as "Times New Roman" or some web browser default font family, then change the font to google font. No matter I import in css, or link in my header, it has same efforts. </p>
  
  <p>Can any one help to explain to me the reason and how should I solve it? Is it because the loading delay of //fonts.googleapis.com/css?</p>
  
  <p>Thanks for help in advance</p>