HTTP/2 : les nouveautés

Le protocole HTTP a été créé au début du Web, en 1997, et n’a quasiment pas bougé depuis. En 2009, Google décide de travailler sur SPDY, une proposition visant à améliorer les performances du protocole HTTP. C’est cette proposition qui a servi de base aux spécifications d’une nouvelle version de ce protocole, dûment nommée HTTP/2.

Support navigateurs & serveurs

Depuis fin 2015, tous les navigateurs sont compatibles, et environ 30% des sites sont hébergés sur des serveurs implémentant ce protocole (source).

Caractéristiques de HTTP/2

HTTPS (quasi) obligatoire

Le chiffrement TLS n’est pas imposé par le standard. Cependant, les navigateurs implémentant le protocole ont décidé de rendre la sécurisation obligatoire pour HTTP/2.

Parallélisation des requêtes

C’est la fonctionnalité phare : l’ensemble des requêtes constituant une page est exécuté en même temps. Cela accélère énormément le temps de chargement d’une page (surtout pour les sites importants avec une grande quantité d’images ou de fichiers CSS et JS).

Je trouve l’image ci-dessous plutôt parlante. Chaque ligne dans le graphe est une requête. Là où avec HTTP/1, chaque requête devait attendre la fin du chargement de la précédente pour démarrer, avec HTTP2 elles sont toutes lancées en même temps.

Source : https://www.fasterize.com/fr/blog/fasterize-accompagne-sites-web-transition-vers-http2/

Compression des headers

C’est une fonctionnalité moins visible mais également très impactante. La compression des headers permet d’économiser un pourcentage non négligeable sur les échanges via headers des requêtes consécutives à une première requête. 

D’après Cloudflare, le trafic est réduit de 53% grâce à la compression des headers.

Push

Enfin, HTTP/2 permet au serveur d’indiquer au navigateur quelles sont les ressources dont il pourrait avoir besoin, et de les charger dans son cache. Par exemple, lorsque le navigateur demande le fichier index.html, le serveur peut inclure dans sa réponse les dépendances de ce fichier, telles que les fichiers de styles, les polices, les icônes, etc.

HTTP/1.1 vs HTTP/2 sans push vs HTTP/2 avec push
HTTP/1.1 vs HTTP/2 sans push vs HTTP/2 avec push (source)

Mise en place de HTTP/2

Comme vous le voyez, les avantages sont légions, et il n’y a aucune raison d’attendre pour y passer. 

D’ailleurs, peut-être que votre site fonctionne déjà en HTTP/2 ? Si vous n’en êtes pas certain, cet outil vous permettra de faire le test.



Hello.
Mon nom est Vincent Ballut, je suis développeur web freelance basé à Paris. J'ai aussi un site pro, un github, et je tweet de temps en temps. Si vous souhaitez me contacter, je réponds plus facilement sur linkedin ou par email.

Ajouter un commentaire

Laisser un commentaire

Hello.
Je m'appelle Vincent Ballut,
développeur web
freelance.

Je publie des articles accessibles et pédagogiques sur tout ce qui touche au développement web et à ses problématiques.

Dans la vraie vie, je suis développeur web freelance basé à Paris, spécialisé dans le développement frontend (Angular, React, VueJS, etc).

J'ai aussi un site pro, un github, et je tweet de temps en temps. Si vous souhaitez me contacter, je réponds plus facilement sur linkedin ou par email.

Derniers articles