I am trying to use, as correctly as possible, browser resources hints (https://w3c.github.io/resource-hints/).
I went on a few large websites and most of them specify the http/https protocol such as like this:
<link rel="preconnect" href="https://cdn.krxd.net">
<link rel="preconnect" href="https://beacon.krxd.net">
<link rel="preconnect" href="https://ads-api.ft.com">
<link rel="preconnect" href="https://www.googletagservices.com">
<link rel="preconnect" href="https://partner.googleadservices.com">
<link rel="preconnect" href="https://securepubads.g.doubleclick.net">
<link rel="preconnect" href="https://tpc.googlesyndication.com">
<link rel="preconnect" href="https://imasdk.googleapis.com">
<link rel="preconnect" href="https://z.moatads.com">
But I found that Shopify does not specify the protocols in the href they refer to
<link rel="dns-prefetch preconnect" href="//cdn.shopify.com" />
<link rel="dns-prefetch preconnect" href="//www.google-analytics.com" />
<link rel="dns-prefetch preconnect" href="//stats.g.doubleclick.net" />
<link rel="dns-prefetch preconnect" href="//bat.bing.com" />
<link rel="dns-prefetch preconnect" href="//bat.r.msn.com" />
It's true that the basic W3C spec also have examples where there is no protocol.
I wondered if not specifying if it's either http or https could have a impact/cost as the browser will have to fetch more information (one for http, one for https) like 2 dns information ?
I wondered if not specifying if it's either http or https could have a impact/cost as the browser will have to fetch more information (one for http, one for https) like 2 dns information ?
No, the browser does not have to make two requests.
This is called a protocol relative URI - the browser will complete it to a full, absolute one using the protocol that the page this was embedded into was requested with.
If you requested the page this is embedded into using https://
- then //foo.bar/
will become https://foo.bar/
; if you used http://
only, then it will become http://foo.bar/
This is a means to allow site authors to write their code in a “protocol agnostic” way. You can deploy a site using this to refer to external resources so that it can be reached either via HTTP or HTTPS, without having to modify all those references. And it helps prevent problems that might arise when you transfer a site from HTTP to HTTPS. If external resources were referred to using http://...
in that case, the browser would block them. Using this technique, it will request the HTTPS version automatically, without any need to modify the code.