Accélération du LCP (Largest Contentful Paint) grâce au préchargement intersite
À partir de Chrome 103 pour Android, Chrome déploiera progressivement un proxy de préchargement privé afin d'accélérer de 30% les navigations sortantes depuis la recherche Google et d'autres sites Web participants (selon la médiane). Cette fonctionnalité de proxy de préchargement privé permet le préchargement de contenu multi-origine sans exposer les informations de l'utilisateur au site Web de destination tant que celui-ci n'a pas accédé au site.
Lisez la suite pour en savoir plus sur le fonctionnement de cette fonctionnalité et sur la façon dont elle peut contribuer à améliorer la métrique Largest Contentful Paint (LCP) de vos sites ou sur la façon dont les sites Web de provenance peuvent aider leurs utilisateurs à atteindre leurs objectifs en accélérant les navigations intersites.
Fonctionnement du proxy de préchargement privé
Canal de communication sécurisé
Cette fonctionnalité utilise un proxy CONNECT
pour établir un canal de communication sécurisé entre Chrome et le serveur hébergeant le contenu à précharger. Ce canal de communication sécurisé empêche le proxy d'inspecter un transfert de données. Surtout, si le proxy de préchargement privé voit nécessairement le nom d'hôte pour établir un canal de communication sécurisé, il ne voit ni les URL complètes, ni les ressources elles-mêmes.
![Animation montrant le flux de données via un proxy.](https://developer.chrome.google.cn/static/blog/private-prefetch-proxy/images/prefetch.png?authuser=5&hl=fr)
CONNECT
empêche la fuite d'informations utilisateur.De plus, le canal de communication sécurisé étant chiffré de bout en bout, les intermédiaires ne peuvent ni observer les noms d'hôte, ni le contenu des sites préchargés. Enfin, le proxy empêche intrinsèquement le serveur de destination de voir l'adresse IP de l'utilisateur.
Empêcher l'identification des utilisateurs
Au-delà des aspects réseau décrits précédemment, nous devons également empêcher les serveurs d'identifier un utilisateur au moment du préchargement, via des informations précédemment stockées sur son appareil. C'est pourquoi Chrome limite actuellement l'utilisation du proxy de préchargement privé aux sites Web pour lesquels l'utilisateur n'a pas de cookies ni d'autre état local. Voici les restrictions applicables aux requêtes de préchargement effectuées via le proxy de préchargement privé:
- Cookies:les requêtes de préchargement ne sont pas autorisées à transmettre des cookies.
- S'il existe un cookie pour une ressource, Chrome effectue une extraction sans identifiant, mais n'utilise pas la réponse (voir la section Mise en cache plus tard).
- Bien que les réponses à une demande de préchargement puissent inclure des cookies, ceux-ci ne seront enregistrés que si l'utilisateur accède à la page préchargée.
- Empreinte digitale:les autres surfaces pouvant être utilisées pour le fingerprinting sont également ajustées. Par exemple, l'en-tête
User-Agent
envoyé par le proxy de préchargement ne contient que des informations limitées.
À l'avenir, nous espérons étendre le proxy de préchargement privé aux liens avec des cookies ou l'état local, tout en conservant les mêmes caractéristiques de confidentialité. Pour en savoir plus, consultez la section Étapes suivantes.
Mise en cache
Chrome précharge les ressources même si elles se trouvent déjà dans le cache, mais elles ne contiennent aucun en-tête conditionnel tel que ETag
ou If-Modified-Since
(qui contiennent des valeurs définies par le serveur qui pourraient être utilisées pour le suivi même sans cookies). Ce préchargement permet d'éviter toute fuite de l'état du cache d'un client vers le site Web préchargé. De plus, Chrome ne valide une ressource préchargée dans le cache que si l'utilisateur décide d'accéder au site Web préchargé.
Premiers pas avec le proxy de préchargement privé
Pour les propriétaires de sites Web
Aucune action n'est requise de la part des propriétaires de sites Web pour commencer à bénéficier d'un proxy de préchargement privé sur les liens pour lesquels l'utilisateur n'a pas de cookies ni d'état local. D'après nos tests, il s'agit d'une opportunité importante pour la plupart des sites Web. En outre, nous vous recommandons d'impressionner les nouveaux visiteurs ou les visiteurs peu fréquents grâce à un chargement ultrarapide. D'après des tests précédents, nous avons constaté une accélération de 20 à 30 % de la vitesse de la métrique Largest Contentful Paint sur les navigations préchargées.
À l'avenir, nous espérons étendre cette fonctionnalité aux liens avec les cookies ou l'état local, tout en préservant ses caractéristiques de confidentialité. Le problème avec les cookies est qu'ils peuvent être utilisés pour modifier l'expérience utilisateur de manière difficilement prévisible. Ainsi, les propriétaires de sites Web devront très probablement activer ou modifier leur site pour bénéficier du proxy de préchargement privé pour les liens contenant des cookies.
Concrètement, alors que les requêtes de préchargement resteront sans identifiant, la page Web aura accès aux cookies et à d'autres états locaux, lorsque l'utilisateur y accédera. Les développeurs peuvent en profiter pour réactiver la personnalisation et les modifications en fonction des cookies ou de l'état local. Il se peut aussi que les développeurs souhaitent déclarer que certaines ressources sont parfaitement adaptées au préchargement et à l'utilisation telles quelles, sans cookies (c'est-à-dire, des ressources qui ne dépendent d'aucun cookie). Veuillez consulter la section Étapes suivantes pour en savoir plus et orienter notre plan d'action.
Contenus ou services dépendant de la géolocalisation
Si votre site Web se comporte différemment (par exemple, un contenu différent ou un accès sélectif) selon les marchés en fonction de l'adresse IP de l'utilisateur, vous vous demandez peut-être comment gérer les requêtes de préchargement du proxy de préchargement privé. Il est important de savoir que le proxy de préchargement privé est alimenté par plusieurs serveurs répartis dans le monde entier, et que l'adresse IP du proxy géolocalise le pays à partir duquel l'utilisateur a lancé le préchargement.
Sachant cela, nous vous recommandons de procéder comme suit:
- Identifiez les requêtes de préchargement du proxy de préchargement privé grâce à la présence d'un en-tête HTTP
Sec-Purpose: Prefetch; anonymous-client-ip
. - Recherchez la géolocalisation du proxy de préchargement privé qui a émis la requête via son adresse IP. Consultez cette ressource pour obtenir la liste à jour des zones géographiques déployées et des adresses IP correspondantes.
- Diffusez les ressources en fonction du marché associé à cette géolocalisation particulière.
Contrôle du trafic
D'après des tests antérieurs, nous savons que cette fonctionnalité entraîne généralement moins de 2% de demandes supplémentaires pour des ressources principales (par exemple, des documents HTML). Cela dit, si vous faites preuve de prudence, vous pouvez utiliser le champ de fraction des conseils de trafic pour contrôler la quantité de trafic que le proxy de préchargement privé doit laisser passer. Vous pouvez commencer par une petite fraction telle que 0,3 (30%), puis l'augmenter progressivement jusqu'à 1 (c'est-à-dire 100%) en ajoutant le fichier JSON suivant à un fichier /.well-known/traffic-advice
, qui doit être diffusé avec le type MIME application/trafficadvice+json
:
[{
"user_agent": "prefetch-proxy",
"fraction": 0.3
}]
Le champ fraction
est une valeur flottante comprise entre 0.0 (aucun préchargement du tout) et 1.0 (100% des requêtes de préchargement aboutissent).
Vous pouvez également désactiver complètement cette fonctionnalité à l'aide de la configuration suivante:
[{
"user_agent": "prefetch-proxy",
"disallow": true
}]
Le fichier /.well-known/traffic-advice
est récupéré par le proxy (et non par le client) et mis en cache sur le proxy selon la sémantique habituelle du cache HTTP. Pour plus de flexibilité, par exemple en cas de pic soudain d'accès lourd, vous pouvez refuser temporairement les requêtes de préchargement (Sec-Purpose: prefetch;anonymous-client-ip
) avec un code d'état 503 et définir l'en-tête Cache-Control: no-store
sur la réponse. Vous pouvez également ajouter l'en-tête Retry-After
pour indiquer à Chrome le temps d'attente avant de relancer les requêtes de préchargement.
Pour les propriétaires de sites Web de provenance
Si vous gérez un site Web contenant de nombreux liens vers d'autres sites, la fonctionnalité de proxy de préchargement privé peut vous intéresser pour accélérer ces navigations entre origines multiples. Vous devez ajouter des règles de spéculation à vos pages pour que Chrome identifie la page qui, selon vous, doit être préchargée via le proxy de préchargement privé. Voici un exemple simple:
<script type="speculationrules">
{
"prefetch": [
"source": "list",
"urls": ["https://example.com/index.html"],
"requires": ["anonymous-client-ip-when-cross-origin"]
]
}
</script>
Étape suivante
Ce lancement n'est qu'une première étape. Nous espérons développer et améliorer cette fonctionnalité en fonction des centres d'intérêt et des commentaires de la communauté. Par exemple, nous aimerions connaître votre avis sur la façon d'étendre les liens avec les cookies et l'état local de manière à simplifier la tâche des développeurs, ou sur les façons de rendre cette fonctionnalité plus utile pour les sites Web de provenance.
Lire la suite
- Proxy de préchargement pour les administrateurs réseau.
- Explication des conseils sur le trafic
- Conseils sur le trafic : idées intéressantes
- Dépôt GitHub du WICG pour les efforts liés à la spéculation sur la navigation
- Blog Chromium dans lequel le concept de proxy de préchargement privé a été introduit.