http2 les impacts dans le web

nAcademy Le 31 mars 2015 Neuros

HTTP/2Les impacts dans le Web

Christophe Villeneuve


Aujourd'hui...● L'origine du commencement● Le protocole web : Http/2● Les conséquences


Les dates

1999 HTTP/1.1

2015 HTTP/2.0

1996 HTTP/1.01991 HTTP/0.9


HTTP/1.0


La fin du HTTP/1.1● 15 ans existance● Le Poids des pages a augmenté● Nouvelles façon de consommer le Web● Emissions de multirequêtes en parallèles● Le Web et les API métiers

Webservices

● Pb : Trop de connexions

(c) Oracle and Orits affiliates


HTTP/2, qu'est ce ?● Développé par IETF (HTTP Working Group)● Basé sur SPDY

– Protocole développé par Google (2009)

– Résoudre les limites de HTTP/1.1

– Gain important sur Firefox, nginx

● Contributeurs : – Firefox, Chrome,

– Twitter, CURL,

– Akamai...


HTTP/2 Illustré


Intérêt HTTP/2


HTTP/2 : Multiplexage (1/3)● Multiplexage des requêtes au serveur● Plusieurs informations/demandes

– dans la même connexion TCP

● Exécution de requêtes en simultanés

par le navigateur – Ex : CSS, images, JS…

● Avant Ordre et blocage● Connexion en parallèle


HTTP/2 : Multiplexage (2/3)


HTTP/2 : Multiplexage (3/3)● HTTP/1.1

● HTTP/2


HTTP/2 : Stream dependencies (1/2)● Permet aux serveurs de 'pousser' les réponses de

manière proactive dans les caches des clients● Possible d'indiquer au serveur les ressources les

plus importantes


HTTP/2 : Stream dependencies (2/2)


HTTP/2 : Headers● Compression des requêtes et des réponses● Binaire (avant c'était du textuelle)● Compresser les actifs

Referer, Cookie's…

● Réduire la charge


HTTP/2 : Server push (1/2)● Plusieurs connexions (parallélisme)● Le plus pour les Systèmes d'informations● Serveur peut envoyer des ressources vers

l'internaute avant de les demandés– Images, CSS, Javascript

● Utilisation du cache● Equilibrer les performances et l'utilité


HTTP/2 : Server push (1/2)


Et… La réalité


On évite...● Quelques fonctionnalités HTTP/1.1

– Domaine fragmentation

– L'image spriting

– Ressources en doublure

– Concaténation


WebPerf ?● Optimisation de la couche TCP

– Plusieurs connexions en TCP

– Durée de connexion plus longue

et unique

– Plus de perte de paquets


Sécurité ?● Chiffrement● Sécurité de la navigation● Intérêt pour le TLS● Chiffrement des échanges

– Serveurs navigateurs↔


Let's GO...● Compatibilité

– Akamai

– Les Navigateurs● Chrome 40, Firefox 36, IE 11

– Curl

– Langage


Les impacts pour nous


Développement● Compatibilité avec API HTTP● Très peu de changements● Meilleurs résultats au niveau de la ressource

Client serveur↔


Java● JEP 110 http://openjdk.java.net/jeps/110● Easy to use API● Covers only the most common use cases● Supports both HTTP/1.1 and 2● Builds on Java API classes going back to

Java 1.2!

http://openjdk.java.net/jeps/110


PHP● CURL

Request

$this>proxy>request

Reponse

$this>proxy>response

Debug

$this>proxy>debug_str


Image HTML<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUA

AAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/

w38GIAXDIBKE0DHxgljNBAAO

9TXL0Y4OHwAAAABJRU5ErkJggg==" alt="Point rouge" />

http://en.wikipedia.org/wiki/Data_URI_scheme


CSS avec plusieurs images#prev {

left: 63px;

width: 43px;

background: url('img_navsprites.gif') 47px 0;

}

#next {

left: 129px;

width: 43px;

background: url('img_navsprites.gif') 91px 0;

}

http://www.w3schools.com/css/css_image_sprites.asp


HTTP URIGET / HTTP/1.1

Host: server.example.com

Connection: Upgrade, HTTP2Settings

Upgrade: h2c

HTTP2Settings: <base64url encoding of HTTP/2 SETTINGS payload>


Serveur

Support HTTP/2


Demo Akamai● Affiche une image (environ 750 ko)

demo concept inspired by Golang's Gophertiles


Débug DevTools Firefox

https://developer.mozilla.org/enUS/docs/Mozilla/Projects/NSS/Key_Log_Format


Merci● Plus loin

– https://http2.github.io/

– http://daniel.haxx.se/http2/

–

● Sources

– Ed Burns

– Mark Nottingham

Questions

@hellosct1

@neuro_paris

https://http2.github.io/

http://daniel.haxx.se/http2/

http2 les impacts dans le web

Internet