Accélérez vos sites avec HTTP / 2

HTTP / 2 est une nouvelle façon de rendre votre site Web beaucoup plus rapide en éliminant de nombreuses inefficacités associées à la version actuelle de HTTP. La meilleure chose à ce sujet? Vous n'avez pas à faire beaucoup d'efforts pour le faire fonctionner.

Ou vous?

Qu'est-ce que HTTP / 2?

Lorsque HTTP1 et HTTP1.1 ont été développés à l'origine, le Web était très différent de ce qu'il est aujourd'hui. Les sites Web ont moins de ressources (fichiers JavaScript, fichiers CSS, images) qu'aujourd'hui. Les connexions à Internet n'étaient pas très rapides et les utilisateurs n'étaient pas très exigeants avec la vitesse de chargement du site Web.

Vous étiez heureux qu'un site Web ait été chargé complètement. Vous vous êtes peut-être secrètement plaint que le chargement était lent. Mais vous ne pouviez pas vraiment faire grand chose à ce sujet. Cela est dû au fait que le temps de chargement lent provient généralement de facteurs indépendants du serveur Web et de la technologie que vous utilisiez. La plupart du temps, c'était la connexion Internet qui constituait le principal facteur limitant.

Avance rapide jusqu'à aujourd'hui. Les temps de chargement des sites Web sont mesurés en millisecondes plutôt que des secondes. Les utilisateurs commencent à avoir les doigts qui piquent quand un site prend plus de 3 secondes pour afficher une réponse. Dans ce genre de situation, les inefficiences comptées en millisecondes associées aux versions originales de HTTP font toute la différence. C'est pourquoi vous avez tellement d'articles à discuter comment rendre votre site plus rapide . Parce que les millisecondes importent.

La nouvelle version de HTTP, appelée HTTP / 2 résout des problèmes spécifiques connus de HTTP. Ses objectifs sont de résoudre un certain nombre de problèmes qui sont devenus plus prononcés au fur et à mesure que le Web évoluait vers des sites Web de plus en plus grands avec beaucoup plus de fichiers CSS, JS et de fichiers d’images que prévu.

Mais qu'est-ce qui ne va pas avec HTTP1.x, et pourquoi dépensons-nous autant d'efforts pour le rendre plus rapide?

Les problèmes de HTTP1.x

HTTP1.x a un certain nombre de problèmes inhérents. En fait, évitons de les appeler des problèmes. HTTP1.x a plusieurs façons d'être plus efficace.

1. HTTP 1.x est basé sur du texte: à l' origine, l'idée était que HTTP1.x devrait être lisible humainement, de sorte qu'il était entièrement basé sur du texte. Par définition, tous les protocoles basés sur du texte sont associés à des inefficacités telles que les espaces, les ruptures de liens, les majuscules, etc.
2. Un seul fichier est en transfert à la fois: c'est l'un des plus gros problèmes avec les versions 1.x de HTTP. Imaginez simplement être un livreur capable de livrer un colis à la fois. Ils doivent retourner à la base chaque fois qu'ils ont besoin de livrer le paquet suivant.
3. Des centaines de requêtes sont requises pour les sites Web d’aujourd’hui: avoir des thèmes plus sophistiqués signifie que la taille des sites Web et le nombre de ressources augmentent. Il en va de même pour le temps nécessaire pour charger chaque ressource. Rappelez-vous que notre "livreur" doit retourner à la base à chaque fois, ils ne peuvent pas transférer plus d'un fichier à la fois.
4. Chaque connexion est une opération technique lourde: des centaines de connexions étant nécessaires, il commence à accumuler des frais généraux importants. Le temps de chargement étant mesuré en millisecondes, le temps combiné nécessaire pour créer une connexion pour des centaines de ressources commence à devenir très important.

Plusieurs fois, les concepteurs Web ont dû mettre en œuvre des mesures spécifiques pour réduire ces inefficacités. Des solutions de contournement telles que les sprites CSS, la minification et la combinaison de fichiers sont destinées à résoudre les problèmes liés au chargement de sites Web.

Ce sont essentiellement des solutions de rechange plutôt que des solutions.

Comment HTTP / 2 résout les problèmes de HTTP1.x

HTTP / 2 est conçu et évolué à partir de SPDY , un protocole conçu à Google visant à rendre le Web 2x plus rapide. Il résout les problèmes HTTP de la manière suivante

1. HTTP / 2 est destiné à être consommé par des machines (votre navigateur Web et le serveur Web de votre site Web) plutôt que par des humains. Il est binaire plutôt que textuel, ce qui le rend intrinsèquement plus efficace. Le transfert et l'analyse des données sont plus rapides en utilisant des protocoles binaires.
2. Plusieurs fichiers peuvent être transférés simultanément sur la même connexion . Les correctifs ont été implémentés de telle sorte que vous pouvez canaliser des ressources sur la même connexion. Plutôt que d'avoir à ouvrir une nouvelle connexion à chaque fois (notre livreur retourne à la base), toutes les ressources peuvent être acheminées sur la même connexion (notre livreur vide tout dans une camionnette et prend tout en un seul voyage).
3. Serveur pousser pour envoyer des fichiers qui seront requis par le navigateur. Dans HTTP1.x, c'est le navigateur Web qui demande au serveur Web les ressources nécessaires. HTTP Server Push (implémenté dans HTTP / 2) permet au serveur de commencer à envoyer des ressources dont il sait que le navigateur Web aura besoin. Par exemple, vous pouvez demander au serveur de ne pas attendre que le navigateur demande les fichiers CSS, JS et autres fichiers dont le navigateur aura besoin de toute façon.
4. En-tête de paquet HTTP et autres optimisations - il s'agit d'améliorations techniques conçues pour améliorer l'efficacité réelle des transferts.

Que faut-il pour activer HTTP2?

Au tout début de l’article, nous avons dit que vous n’avez pas besoin de beaucoup d’efforts pour activer HTTP / 2. L'activation de HTTP / 2 doit être effectuée au niveau du serveur Web. La plupart des serveurs Web tels qu'Apache, Nginx, IIS et d'autres serveurs Web majeurs prennent déjà en charge HTTP / 2.

Si vous utilisez votre propre serveur Web, il vous suffit d'installer et d'activer les bibliothèques HTTP / 2. Si votre site Web est hébergé par une société d'hébergement, vérifiez auprès de la société si le serveur Web est déjà activé pour HTTP / 2.

La prise? Certificats sécurisés

Peut-être que les choses étaient trop belles pour être vraies. Nous venons de discuter de la manière dont les serveurs Web supportent déjà entièrement HTTP / 2.

La plupart des principaux navigateurs Web prennent également en charge HTTP / 2. Cependant, ils ont également choisi de ne prendre en charge que HTTP / 2 en mode chiffré. La raison en est qu'il y a eu un fort mouvement pour activer HTTPS (cryptage) sur tout le Web. Des initiatives telles que HTTPS partout pousser fortement le besoin de HTTPS sur tous les sites Web.

En ne prenant pas en charge HTTP / 2 sur les connexions non cryptées, les propriétaires de sites Web sont fortement armés pour implémenter des HTTP pour leur site Web.

Bien sûr, ce n'est pas nécessairement une mauvaise chose. La mise en œuvre du protocole HTTPS présente des avantages importants en termes de sécurité et de confidentialité. Les entreprises se regroupant pour former une autorité de certification appelée Crypte pour permettre des certificats sécurisés gratuits, le coût global d'acquisition d'un certificat et la mise en œuvre du protocole HTTPS deviennent beaucoup moins chers. C'était relativement cher jusqu'à il y a quelque temps.

L'implémentation de HTTPS n'est pas quelque chose que vous devriez faire sans lui donner la réflexion nécessaire. Vous voudrez probablement en discuter avec votre développeur de site Web de confiance ou avec une expertise technique suffisante. La plupart du temps, votre hébergeur devrait pouvoir vous guider à travers cela.

Bien sûr, il est fortement recommandé d’implémenter HTTPS. Outre la sécurité supplémentaire, vous allez pouvoir activer HTTP / 2 et rendre votre site Web plus rapide. C'est ce que nous appelons une situation gagnant-gagnant.

D'autres techniques d'optimisation sont-elles encore nécessaires?

Oui et non.

Certaines optimisations visant à réduire les requêtes Web deviennent superflues. Si votre site nécessite du temps de calcul pour "combiner" des fichiers JS, CSS et autres, cela devient un coût supplémentaire. Chaque fois que l'on "gaspille" les inefficacités mentionnées ci-dessus n'est plus nécessaire.

D'autre part, ces optimisations telles que la mise en cache, la réduction de la taille des ressources, la fourniture de contenu sur un CDN, le choix d'un serveur d'hébergement performant et d'autres optimisations permettant de résoudre différents types d'inefficacité doivent rester en place.

Ce qui est génial avec HTTP / 2, c'est que non seulement votre site Web se charge plus rapidement, mais il vous incite également à sécuriser votre site Web. Il ne fait aucun doute qu'il existe des avantages pour les deux. HTTP / 2 est la prochaine étape pour rendre tout le Web plus rapide. Faisons tous partie de cela et le faisons arriver.

• ← 20 astuces CSS essentielles que tout concepteur doit connaître
• Présentation de la nouvelle propriété d'affichage des polices CSS →