Utilisation de rel = preconnect pour les ressources http et https du même domaine

Question

Je travaille actuellement sur un projet Web et je recherche des conseils en matière de pré-connexion à un domaine pour les sous-ressources. Mon hypothèse est que, idéalement, toutes les sous-ressources devraient être desservies à partir du domaine en utilisant le même protocole, épargnant ainsi des allers-retours au serveur. Cependant, dans certaines zones du code sur lequel je travaille, certaines ressources sont chargées via http et dans d'autres zones, les ressources sont chargées via https.

Pour les besoins de cette question, veuillez imaginer que je n'ai pas accès à certaines sections du code.

Pour obtenir les avantages de la pré-connexion, (dans le temps entre maintenant et assurer la liaison avec d'autres pour utiliser la même route), serait-il préférable d'inclure:

<link rel="preconnect" href="http://www.example.com" /> 
<link rel="preconnect" href="https://www.example.com" /> 

Ou utilisez le suivant protocole utilisé URL relative:

<link rel="preconnect" href="//www.example.com" /> 

Answer 1

Vous devez preconnect aux deux protocoles parce qu'ils sont considérés comme deux domaines différents par le navigateur:

<link rel="preconnect" href="http://www.example.com" /> 
<link rel="preconnect" href="https://www.example.com" /> 

Si vous voulez aller plus loin, je recommande également l'utilisation de dns-prefetch, pour les navigateurs qui ne peuvent pas actuellement gérer preconnect. Donc, cela ressemblerait à:

<link rel="preconnect" href="http://www.example.com" /> 
<link rel="dns-prefetch" href="http://www.example.com" /> 
<link rel="preconnect" href="https://www.example.com" /> 
<link rel="dns-prefetch" href="https://www.example.com" />