How can I check has link[rel=preconnect] done its job or not?

Question

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

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

Which tools can I use to see this event?

Answer 1

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.

Answer 2

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

Here is an example:

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