title: Chrome Dev Tools - where to spot a dns prefetch performed with rel=dns-prefetch
body: <p>I have doubts the rel-prefetch I am using are really performed as expected. Indeed, I don't see on webpagetest the dns part seperated form the rest of the line as it should be (see <a href="https://stackoverflow.com/a/40380983/1467802">https://stackoverflow.com/a/40380983/1467802</a> or by one of the chart here about google analytics <a href="https://christoph-rumpel.com/2013/04/front-end-performance-part-01-assets-loading/" rel="nofollow noreferrer">https://christoph-rumpel.com/2013/04/front-end-performance-part-01-assets-loading/</a> loading)</p>
  
  <p>View.html</p>
  
  <pre><code>&lt;link rel="dns-prefetch" href="https://connect.facebook.net" /&gt;
  &lt;link rel="dns-prefetch" href="https://www.facebook.com" /&gt; 
  &lt;link rel="preconnect" href="https://connect.facebook.net" /&gt;
  &lt;link rel="preconnect" href="https://www.facebook.com" /&gt;
  </code></pre>
  
  <p>In my page I'm calling the following facebook sdk only when a user clicks a button</p>
  
  <pre><code>$('#button").on('click', function(e) {
    window.fbAsyncInit = function() {
        FB.init({
          appId             : fbAppId,
          autoLogAppEvents  : true,
          status            : false,
          xfbml             : true,
          version           : 'v2.11'
        });
  
      };
      (function(d, s, id){
        console.log('LIBRARY - Loading and initializing Facebook javascript SDK');
        var js, fjs = d.getElementsByTagName(s)[0];
        if (d.getElementById(id)) {return;}
        js = d.createElement(s); js.id = id; js.async = true;
        js.src = "//connect.facebook.net/en_US/sdk.js";
        fjs.parentNode.insertBefore(js, fjs);
       }(document, 'script', 'facebook-jssdk')
      );
  });
  </code></pre>
  
  <p>So when I load the page and check Chrome Dev Tools, I was expecting not to see the sdk (that's to be expected as it will only load when I click the #button) but at least to see somewhere the dns lookup already but I don't see any sign/hints about this prefetch request on the Network tab nor on the Performance tab.
  And when I click the  #button, a line appears for sdk.js in Network tab but checking the Timing details, I see the dns is just before the rets, there's no "gap" between them ,and it seems it did not occur well before the rest as it should have.</p>
  
  <p>How and where to spot those "dns prefetching" inside Chrome Dev tools.</p>
  
  <p>I'm giving here the example of fb script but for my other scripts it's the same thing.</p>