Preconnect : définition et optimisation du chargement des ressources
Directive permettant d’anticiper la connexion réseau vers un domaine tiers avant que la requête réelle ne soit envoyée.
En cliquant, vous acceptez les cookies de YouTube.
Définition
Le Preconnect (rel="preconnect") est une instruction qui permet au navigateur d’établir une connexion anticipée avec un serveur externe. Il réalise les étapes de résolution DNS, de négociation TCP et de chiffrement TLS, éliminant ainsi ces délais lors de l’appel effectif de la ressource.
ㅤ
→ Prendre RDV pour votre projet maintenant
Bonnes pratiques
- Implémenter progressivement : À réserver aux domaines tiers critiques (ex: Google Fonts, CDN d’images, scripts de paiement).
- Mesurer avec Lighthouse : Surveiller la réduction du temps de latence réseau sur les ressources externes prioritaires.
- Combiner avec dns-prefetch : Utiliser
dns-prefetchen fallback pour les navigateurs plus anciens afin de garantir une résolution DNS rapide. - Automatiser le monitoring : Vérifier que les domaines préconnectés sont toujours utilisés pour ne pas gaspiller de ressources processeur.
À éviter
- Chargements bloquants : Préconnecter trop de domaines (plus de 2 ou 3) peut ralentir le chargement de la page principale en surchargeant le réseau.
- Assets non optimisés : Ne pas utiliser le preconnect pour des domaines dont vous n’avez besoin qu’en fin de chargement (ex: scripts de chat en bas de page).
- Modifications non mesurées : Oublier de supprimer les directives vers des domaines qui ne sont plus présents sur votre site.
Qu’est-ce que le preconnect ?
Le preconnect est une instruction HTML qui permet au navigateur d’anticiper la connexion à un domaine externe pour accélérer le chargement des ressources.
À quoi sert le preconnect en SEO et en performance web ?
Il réduit le temps de latence en préparant à l’avance la connexion réseau (DNS, TCP et TLS) vers des ressources externes.
Comment fonctionne le preconnect ?
Le navigateur établit en avance la connexion avec un domaine tiers avant même de demander les ressources associées.
Quelle est la différence entre preconnect et dns-prefetch ?
Le dns-prefetch ne fait que la résolution DNS, tandis que le preconnect prépare l’ensemble de la connexion réseau.
Quand faut-il utiliser le preconnect ?
Il est recommandé pour les ressources critiques provenant de domaines externes comme les CDN, polices ou scripts tiers.
Le preconnect améliore-t-il le SEO ?
Indirectement, oui. En améliorant les performances et la vitesse de chargement, il peut contribuer à une meilleure expérience utilisateur.
- MEDIA DEVSOURCE
Dernières tendances et analyses