10

I append link[rel=preconnect] in my page's HTML code. But how can I check works preconnect or not?

Preconnect does not appear in the Network panel of DevTools, I don't see it in chrome://tracing.

Which tools can I use to see this event?

Victor
  • 3,669
  • 3
  • 37
  • 42
andre487
  • 1,261
  • 2
  • 18
  • 27
  • This is not really a good question for Stack Overflow, since it's asking for a tool, but I would think that something like Fiddler (on Windows anyway) would be able to track something like that. – Heretic Monkey Oct 07 '16 at 20:59
  • I'm not sure that this tools are good solution because it's difficult to distinguish a preconnect event and a first request to the host. – andre487 Oct 08 '16 at 10:17
  • 1
    Some useful advice in here too: https://stackoverflow.com/questions/39629343/ – Giorgio Tempesta Dec 20 '18 at 08:32

3 Answers3

5

You can see it in the waterfall created by https://www.webpagetest.org/

Here is an example:

enter image description here

Note that your website needs to be accessible online, for WebPageTest to be able to read it.

Gaël Métais
  • 804
  • 7
  • 7
  • Thanks! But is there some ways to check preconnect if you project is inside an intranet? – andre487 Oct 08 '16 at 10:19
  • You can try setting up a temporary tunnel to make the website available outside, https://ngrok.com is the one I use. But both your main domain and the domain you want to preconnect must be made accessible. So if you tunnel the second domain, you'll need to change your code so that it points to the new tunnel domain. – Gaël Métais Oct 09 '16 at 01:07
  • The other solution is to setup your own private instance of WebPageTest inside the intranet. Many companies have they own instance so they can do performance checking before pushing projects to production. – Gaël Métais Oct 09 '16 at 01:14
5

You can use Chrome DevTools for this, manually. Check timing tab of URI for which you defined preconnect, if DNS-Connect-SSL haven't took time or it negligible small (like, 2-5msec), than you can consider preconnect worked. The only trap here is repeated test, when you connection is not expired yet in browser.

Alexander Podkopaev
  • 66
  • 1
  • 2
1

This tool from DebugBear shows this, and other useful preload / preconnect data:

https://www.debugbear.com/resource-hint-validator

Simon_Weaver
  • 140,023
  • 84
  • 646
  • 689