nAcademy  Le 31 mars 2015 Neuros ­ 
HTTP/2
Les impacts dans le Web
Christophe Villeneuve
nAcademy  Le 31 mars 2015 Neuros ­ 
Aujourd'hui...
● L'origine du commencement
● Le protocole web : Http/2
● Les conséquen...
nAcademy  Le 31 mars 2015 Neuros ­ 
Les dates
1999  HTTP/1.1
2015  HTTP/2.0
1996  HTTP/1.0
1991  HTTP/0.9
nAcademy  Le 31 mars 2015 Neuros ­ 
HTTP/1.0
nAcademy  Le 31 mars 2015 Neuros ­ 
La fin du HTTP/1.1
● 15 ans existance
● Le Poids des pages a augmenté
● Nouvelles faço...
nAcademy  Le 31 mars 2015 Neuros ­ 
HTTP/2, qu'est ce ?
● Développé par IETF (HTTP Working Group)
● Basé sur SPDY 
– Proto...
nAcademy  Le 31 mars 2015 Neuros ­ 
HTTP/2 Illustré
nAcademy  Le 31 mars 2015 Neuros ­ 
Intérêt HTTP/2
nAcademy  Le 31 mars 2015 Neuros ­ 
HTTP/2 : Multiplexage (1/3)
● Multiplexage des requêtes au serveur
● Plusieurs informa...
nAcademy  Le 31 mars 2015 Neuros ­ 
HTTP/2 : Multiplexage (2/3)
nAcademy  Le 31 mars 2015 Neuros ­ 
HTTP/2 : Multiplexage (3/3)
● HTTP/1.1
● HTTP/2
nAcademy  Le 31 mars 2015 Neuros ­ 
HTTP/2 : Stream dependencies (1/2)
● Permet aux serveurs de 'pousser' les réponses de ...
nAcademy  Le 31 mars 2015 Neuros ­ 
HTTP/2 : Stream dependencies (2/2)
nAcademy  Le 31 mars 2015 Neuros ­ 
HTTP/2 : Headers
● Compression des requêtes et des réponses
● Binaire (avant c'était d...
nAcademy  Le 31 mars 2015 Neuros ­ 
HTTP/2 : Server push (1/2)
● Plusieurs connexions (parallélisme)
● Le plus pour les Sy...
nAcademy  Le 31 mars 2015 Neuros ­ 
HTTP/2 : Server push (1/2)
nAcademy  Le 31 mars 2015 Neuros ­ 
Et… La réalité
nAcademy  Le 31 mars 2015 Neuros ­ 
On évite...
● Quelques fonctionnalités HTTP/1.1
– Domaine fragmentation
– L'image spri...
nAcademy  Le 31 mars 2015 Neuros ­ 
WebPerf ?
● Optimisation de la couche TCP
– Plusieurs connexions en TCP
– Durée de con...
nAcademy  Le 31 mars 2015 Neuros ­ 
Sécurité ?
● Chiffrement
● Sécurité de la navigation
● Intérêt pour le TLS
● Chiffreme...
nAcademy  Le 31 mars 2015 Neuros ­ 
Let's GO...
● Compatibilité
– Akamai
– Les Navigateurs
● Chrome 40, Firefox 36, IE 11
...
nAcademy  Le 31 mars 2015 Neuros ­ 
Les impacts pour nous
nAcademy  Le 31 mars 2015 Neuros ­ 
Développement
● Compatibilité avec API HTTP
● Très peu de changements
● Meilleurs résu...
nAcademy  Le 31 mars 2015 Neuros ­ 
Java
● JEP 110 http://openjdk.java.net/jeps/110
● Easy to use API
● Covers only the mo...
nAcademy  Le 31 mars 2015 Neuros ­ 
PHP
● CURL
Request
$this­>proxy­>request
Reponse
$this­>proxy­>response
Debug
$this­>p...
nAcademy  Le 31 mars 2015 Neuros ­ 
Image HTML
<img
src="data:image/png;base64,iVBORw0KGgoAA
AANSUhEUgAAAAUA
AAAFCAYAAACNb...
nAcademy  Le 31 mars 2015 Neuros ­ 
CSS avec plusieurs images
#prev {
left: 63px;
width: 43px;
background: url('img_navspr...
nAcademy  Le 31 mars 2015 Neuros ­ 
HTTP URI
GET / HTTP/1.1
Host: server.example.com
Connection: Upgrade, HTTP2­Settings
U...
nAcademy  Le 31 mars 2015 Neuros ­ 
Serveur
Support HTTP/2
nAcademy  Le 31 mars 2015 Neuros ­ 
nAcademy  Le 31 mars 2015 Neuros ­ 
Demo Akamai
● Affiche une image (environ 750 ko)
demo concept inspired by Golang's Gop...
nAcademy  Le 31 mars 2015 Neuros ­ 
Débug DevTools Firefox
https://developer.mozilla.org/en­US/docs/Mozilla/Projects/NSS/K...
nAcademy  Le 31 mars 2015 Neuros ­ 
Merci
● Plus loin
– https://http2.github.io/
– http://daniel.haxx.se/http2/
–
● Source...
nAcademy  Le 31 mars 2015 Neuros ­ 
Qui... est Christophe Villeneuve ?
<<
afup – lemug.fr – mysql – mariadb – drupal – dem...
Prochain SlideShare
Chargement dans…5
×

Http2 les impacts dans le web

606 vues

Publié le

Présentation à la nAcademy (Avril 2015) de Neuros : HTTP2 les impacts dans le web par Christophe Villeneuve

Publié dans : Internet
0 commentaire
0 j’aime
Statistiques
Remarques
  • Soyez le premier à commenter

  • Soyez le premier à aimer ceci

Aucun téléchargement
Vues
Nombre de vues
606
Sur SlideShare
0
Issues des intégrations
0
Intégrations
10
Actions
Partages
0
Téléchargements
5
Commentaires
0
J’aime
0
Intégrations 0
Aucune incorporation

Aucune remarque pour cette diapositive

Http2 les impacts dans le web

  1. 1. nAcademy  Le 31 mars 2015 Neuros ­  HTTP/2 Les impacts dans le Web Christophe Villeneuve
  2. 2. nAcademy  Le 31 mars 2015 Neuros ­  Aujourd'hui... ● L'origine du commencement ● Le protocole web : Http/2 ● Les conséquences
  3. 3. nAcademy  Le 31 mars 2015 Neuros ­  Les dates 1999  HTTP/1.1 2015  HTTP/2.0 1996  HTTP/1.0 1991  HTTP/0.9
  4. 4. nAcademy  Le 31 mars 2015 Neuros ­  HTTP/1.0
  5. 5. nAcademy  Le 31 mars 2015 Neuros ­  La fin du HTTP/1.1 ● 15 ans existance ● Le Poids des pages a augmenté ● Nouvelles façon de consommer le Web ● Emissions de multi­requêtes en parallèles ● Le Web et les API métiers  Webservices ● Pb : Trop de connexions  (c) Oracle and Orits affiliates
  6. 6. nAcademy  Le 31 mars 2015 Neuros ­  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...
  7. 7. nAcademy  Le 31 mars 2015 Neuros ­  HTTP/2 Illustré
  8. 8. nAcademy  Le 31 mars 2015 Neuros ­  Intérêt HTTP/2
  9. 9. nAcademy  Le 31 mars 2015 Neuros ­  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
  10. 10. nAcademy  Le 31 mars 2015 Neuros ­  HTTP/2 : Multiplexage (2/3)
  11. 11. nAcademy  Le 31 mars 2015 Neuros ­  HTTP/2 : Multiplexage (3/3) ● HTTP/1.1 ● HTTP/2
  12. 12. nAcademy  Le 31 mars 2015 Neuros ­  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
  13. 13. nAcademy  Le 31 mars 2015 Neuros ­  HTTP/2 : Stream dependencies (2/2)
  14. 14. nAcademy  Le 31 mars 2015 Neuros ­  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
  15. 15. nAcademy  Le 31 mars 2015 Neuros ­  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é
  16. 16. nAcademy  Le 31 mars 2015 Neuros ­  HTTP/2 : Server push (1/2)
  17. 17. nAcademy  Le 31 mars 2015 Neuros ­  Et… La réalité
  18. 18. nAcademy  Le 31 mars 2015 Neuros ­  On évite... ● Quelques fonctionnalités HTTP/1.1 – Domaine fragmentation – L'image spriting – Ressources en doublure  – Concaténation
  19. 19. nAcademy  Le 31 mars 2015 Neuros ­  WebPerf ? ● Optimisation de la couche TCP – Plusieurs connexions en TCP – Durée de connexion plus longue  et unique – Plus de perte de paquets
  20. 20. nAcademy  Le 31 mars 2015 Neuros ­  Sécurité ? ● Chiffrement ● Sécurité de la navigation ● Intérêt pour le TLS ● Chiffrement des échanges  – Serveurs   navigateurs↔
  21. 21. nAcademy  Le 31 mars 2015 Neuros ­  Let's GO... ● Compatibilité – Akamai – Les Navigateurs ● Chrome 40, Firefox 36, IE 11 – Curl – Langage
  22. 22. nAcademy  Le 31 mars 2015 Neuros ­  Les impacts pour nous
  23. 23. nAcademy  Le 31 mars 2015 Neuros ­  Développement ● Compatibilité avec API HTTP ● Très peu de changements ● Meilleurs résultats au niveau de la ressource  Client   serveur↔
  24. 24. nAcademy  Le 31 mars 2015 Neuros ­  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!
  25. 25. nAcademy  Le 31 mars 2015 Neuros ­  PHP ● CURL Request $this­>proxy­>request Reponse $this­>proxy­>response Debug $this­>proxy­>debug_str
  26. 26. nAcademy  Le 31 mars 2015 Neuros ­  Image HTML <img src="data:image/png;base64,iVBORw0KGgoAA AANSUhEUgAAAAUA AAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/ w38GIAXDIBKE0DHxgljNBAAO 9TXL0Y4OHwAAAABJRU5ErkJggg==" alt="Point rouge" /> http://en.wikipedia.org/wiki/Data_URI_scheme
  27. 27. nAcademy  Le 31 mars 2015 Neuros ­  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_sprite s.asp
  28. 28. nAcademy  Le 31 mars 2015 Neuros ­  HTTP URI GET / HTTP/1.1 Host: server.example.com Connection: Upgrade, HTTP2­Settings Upgrade: h2c HTTP2­Settings: <base64url encoding of HTTP/2  SETTINGS payload>
  29. 29. nAcademy  Le 31 mars 2015 Neuros ­  Serveur Support HTTP/2
  30. 30. nAcademy  Le 31 mars 2015 Neuros ­ 
  31. 31. nAcademy  Le 31 mars 2015 Neuros ­  Demo Akamai ● Affiche une image (environ 750 ko) demo concept inspired by Golang's Gophertiles
  32. 32. nAcademy  Le 31 mars 2015 Neuros ­  Débug DevTools Firefox https://developer.mozilla.org/en­US/docs/Mozilla/Projects/NSS/Key_Log_Format
  33. 33. nAcademy  Le 31 mars 2015 Neuros ­  Merci ● Plus loin – https://http2.github.io/ – http://daniel.haxx.se/http2/ – ● Sources  – Ed Burns – Mark Nottingham Questions @hellosct1 @neuro_paris
  34. 34. nAcademy  Le 31 mars 2015 Neuros ­  Qui... est Christophe Villeneuve ? << afup – lemug.fr – mysql – mariadb – drupal – demoscene – firefoxos – drupagora – phptour – forumphp – solutionlinux – demoinparis – ici et maintenant – eyrolles – editions eni – programmez – linux pratique – webriver – phptv – neuros ­ elephpant

×