-1

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 ?

Mathieu
  • 4,587
  • 11
  • 57
  • 112
  • 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. _“as the browser will have to fetch more information (one for http, one for https)”_ - that is not what happens. – CBroe Feb 12 '18 at 08:29
  • Yes, i know what a relative protocol is but I'm not sure to understand your answer: will the browser make 2 dns requests if I use //example.com, as it must check the dns for http://example.com and the dns for https://example.com ? can the dns be different for https and http ? in that case even if it's only a few hundred bytes, I could shove off /speed up things by only putting the protocoal which will be used https://exmaple.com – Mathieu Feb 12 '18 at 08:52
  • No, it won’t. It has to make _one_ request, depending on what the resulting full absolute URL is. – CBroe Feb 12 '18 at 08:54
  • 1
    https://www.paulirish.com/2010/the-protocol-relative-url/ – CBroe Feb 12 '18 at 08:54
  • please answer this in a formal answer so I can attribute the points:) – Mathieu Feb 12 '18 at 08:54
  • your Paul Irish article is very interesting. He actually recommends being explicit about the protocol, not for the speed reason (you were right about it) but for security reason: "Now that SSL is encouraged for everyone and doesn’t have performance concerns, this technique is now an anti-pattern. If the asset you need is available on SSL, then always use the https:// asset." – Mathieu Feb 12 '18 at 08:56

1 Answers1

3

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.

CBroe
  • 91,630
  • 14
  • 92
  • 150