Cloudflare, le CDN le plus utilisé au monde a récemment annoncé l’utilisation d’un nouveau standard web : Early Hints. Cette nouvelle technologie actuellement disponible en version beta promet de charger les sites Web jusqu’à 30% plus rapidement.
Dans un article publié sur leur blog, Cloudflare se vente d’être le premier “hébergeur” à proposer cette technologie innovante :
Early Hints améliore considérablement les performances de chargement des pages du navigateur. […] Lors des premiers tests utilisant Early Hints, nous avons observé une amélioration de plus de 30 % du temps de chargement des pages pour les navigateurs visitant un site Web pour la première fois”, détaille Cloudflare
Comment fonctionne Early Hints ?
Pour charger une page Web, le navigateur (Safari, Chrome, Firefox) doit obtenir une série d’instructions de la part du serveur Web (ou CDN si votre site est en proxy sur Cloudflare). Ces instructions expliquent aux navigateurx quels contenus statiques (Images, texte) afficher à l’écran. Afin de réduire le temps de chargement de votre site Web, Cloudflare va transmettre des “conseils précoces” directement au navigateur pendant que le serveur Web charge les instructions. L’équipe de Cloudflare détail le procédé :
En envoyant ces conseils à un navigateur avant que la réponse complète ne soit préparée, le navigateur peut déterminer ce qu’il doit faire pour charger la page Web plus rapidement
C’est donc au travers d’une étroite collaboration entre les développeurs de navigateurs Web et Cloudflare que la mise en place de cette technologie a pu se faire.
Early Hints : Code 103
Le code HTTP 103 est un nouveau code HTTP expérimental défini dans la RFC 8297. Il s’agit d’un statut informationnel qui peut être envoyé par un serveur avant la réponse HTTP principale. Utilisé en conjonction avec l’en-tête HTTP Link et la relation preload, 103 donne au client la possibilité de récupérer des ressources (assets, images, documents liés à l’API…) liées à celles explicitement demandées, le plus tôt possible, alors que le serveur prépare la réponse principale. (Source : https://developer.mozilla.org/fr/docs/Web/HTTP/Status/103)
Voici ci-dessous un exemple de réponse HTTP au code 103 Early Hints :
HTTP/1.1 103 Early Hints
Link: </style.css>; rel=preload; as=style
Link: </script.js>; rel=preload; as=script
HTTP/1.1 200 OK
Date: Fri, 26 May 2017 10:02:11 GMT
Content-Length: 1234
Content-Type: text/html; charset=utf-8
Link: </style.css>; rel=preload; as=style
Link: </script.js>; rel=preload; as=scriptComment activer Early Hints sur Cloudflare pour optimiser votre site WordPress
Pour commencer, votre nom de domaine doit pointer sur les NS Cloudflare pour pouvoir activer la fonctionnalité Proxy. Connectez-vous au dashboard Cloudflare et rendez-vous dans la configuration de votre domaine.
Dans le menu Speed, puis onglet Optimisation : descendez sur la section Distribution optimisée, puis Early Hints (Bêta) :
Rejoignez le programme Beta pour pouvoir activer la fonctionnalité. Après quelques heures / jours, Cloudflare approuvera (ou non …) votre demande et activera la fonctionnalité Early Hints sur votre domaine.
Pour rappel, votre domaine doit passer par le proxy Cloudflare pour que cette fonctionnalité (et les autres) puissent fonctionner correctement :
