HTTP2 in action - Piet Van Dongen - Codemotion Amsterdam 2017
•
1 j'aime•767 vues
We've all heard about HTTP/2, but what's in it for us? Is it really that much better? How can we start using it? During this talk, we will explore HTTP/2's new features while creating our own web server, demonstrating new features like server push, multiplexing and header compression. At then end, we can proof how HTTP/2 benefits not only the end user, but developers and operations as well!.
Recommandé
Recommandé
Contenu connexe
Tendances
Tendances (20)
Similaire à HTTP2 in action - Piet Van Dongen - Codemotion Amsterdam 2017
Similaire à HTTP2 in action - Piet Van Dongen - Codemotion Amsterdam 2017 (20)
Plus de Codemotion
Plus de Codemotion (20)
Dernier
Dernier (20)
HTTP2 in action - Piet Van Dongen - Codemotion Amsterdam 2017
- 1. AMSTERDAM 16 – 17 MAY 2017 HTTP/2 in action Piet van Dongen
- 2. @pietvandongen About me Piet van Dongen… …is a Senior Software Engineer at Luminis Arnhem. …is a full stack engineer (Java and frontend stuff). …thinks: people > technology. …could have just as easily been a teacher. …should start running again.
- 3. What are we gonna do till lunch? What we say we do What it is we do Introduce the talk Try to sneak in Check Twitter / Facebook Dive into HTTP/2 theory Try to sneak out again Sneak siesta Look at HTTP/2 in practice Pay attention for a moment Go back to Tweeting Create a HTTP/2 server (live!) Laugh at Piet fumbling Pray to the demo gods Answer questions Sneak out for lunch Dodge difficult questions
- 5. HTTP in perspective • A bit of history • The technology • Why HTTP/2? • New features
- 7. 1941 • Jorge Luis Borges' The Garden of Forking Paths • Hypertekst-fictie
- 8. • Vannevar Bush's As We May Think • Essay on the memex (memory + index) • Proto hypertext system • Collective memory • Information explosion • Knowledge explosion 1945
- 9. Douglas Engelbart • 1962: Creates NLS (oN-Line System) • 1968: The Mother of All Demos Ted Nelson & Andries van Dam • 1963: Nelson coins hypertext en hypermedia • 1967: With Van Dam: Hypertext Editing System • 1976: FRESS (File Retrieval and Editing System) 1962 – 1976
- 10. • Aspen Movie Map (funded by (D)ARPA) • First hypermedia system 1978
- 11. • Sir Tim Berners Lee bedenkt ENQUIRE (wiki) • Peter J. Brown bedenkt Guide • Roberto Busa bedenkt Index Thomisticus 1980
- 12. • Ben Shneiderman developes TIES (The Interactive Encyclopedia System) • First electronic book: Hypertext Hands-On! 1983
- 13. • Apple Computer's HyperCard • ACM Hypertext Conference • Storyspace (hypertext fiction software) 1987
- 14. • Sir Tim Berners Lee (CERN): WorldWideWeb • HyperText • Network • Browsers 1989
- 15. • HTTP V0.9 • TCP-IP connection • Request: GET address (no http://, host or port) • Response: byte stream of ASCII characters • After transfer: connection close 1991
- 16. • Browser Lynx • Birth of the internet • 500 web servers 1993
- 17. • W3C (World Wide Web Consortium) founded • 10.000 web servers 1994
- 18. • HTTP V1.0 • No formal specification • Required version number in request • Headers • Status codes • New OPTIONS method 1995
- 19. • Pre-standard HTTP/1.1 • Fast adoption: Arena, Netscape, Mosaic, Lynx, IE 2.0 • March: 40% of browsers compliant • June: 65% 1996
- 20. • Standard HTTP/1.1 (RFC 2068) • Required header Host • Open connections • Better caching (ETags and headers) • Lots of additions and improvements 1997
- 21. • HTTP/1.1 improvements (RFC 2616) 1999
- 22. • HTTPbis Working Group takes 7 years to improve and clear up HTTP/1.1 2007
- 23. • SPDY developed by Google 2012
- 24. • A new standard: HTTP/2 2015
- 25. The technology
- 26. Terminology • Hypertext Transfer Protocol • Hypertext: structured text with linked (text) nodes • Protocol: to transfer hypertext from server to clients • TCP/IP: Internet Protocol Suite • HTTP is protocol in top layer (application) HTTP TCPUDP Application Transport IP Internet Ethernet Link
- 27. The protocol from a bird's eye view • Client / user agent asks (request) • Methods: GET, PUT, POST, DELETE, HEAD… • Server answers (response) • Status codes: 200 OK, 404 Not Found, 500 Internal Server Error… • Resources identified by URLs • protocol://host[:port]/path
- 30. Why HTTP/2?
- 31. What is wrong with HTTP/1.1? • Web pages contain more resources than ever • Efficient loading using 1 request per HTTP connection is hard • Parallel is possible, but… change of congestions • A lot of overhead, especially headers • Hacks needed: image sprites, data inlining, domain sharding, …
- 32. How is HTTP/2 gonna solve that? • Binary protocol: more efficient parsing, more compact, fewer errors • Multiplexing: • Non ordered, interleaved if necessary • Non blocking, but all data at once • Just one TCP connection: less congestion, more fair on network • Header compression with HPACK: more compact and robust • Server push: pushing data on expected demand • Compatible with HTTP/1.1
- 33. New features
- 34. Binary protocol • More efficient, easy to parse • More compact on the wire • Harder to read for humans Application (HTTP) Transport (TCP) Network (IP) Link (Ethernet) Binary Framing HEADERS frame DATA frame
- 35. Streams, messages, frames • Stream: bidirectional flow of bytes, contains 1 or more messages • Message: sequence of frames, map to request of response • Frame: smalles unit of communication, references stream Stream 1 HEADERS Stream 2 HEADERS Stream 2 DATA Stream 2 DATA
- 36. Multiplexing • Everything on a single connection • Messages in random order • No guessing • No congestion Stream 5 DATA Stream 1 DATA Stream 3 DATA Stream 3 DATA Stream 2 DATA Stream 3 HEADERS Stream 1 DATA Stream 2 DATA Stream 1 DATA
- 37. Server push • Multiple response for 1 request • Serve before request Stream 1 FRAME 2 Stream 4 FRAME 1 …Stream 1 FRAME n Stream 4 PROMISE Stream 2 PROMISE
- 38. :path: /blog/383 7 38: example.com :path: /blog 19: text/html 58: Mozilla/5… Header compression (HPACK) • Huffman encoding • ~30% size reduction • Only diffs on subsequent requests Stream 1 HEADERS Stream 2 HEADERS :method GET :scheme https :host example.nl :path /blog accept text/html user-agent Mozilla/5… :method GET :scheme https :host example.nl :path /blog/38 accept text/html user-agent Mozilla/5…
- 39. ALPN • Application-Layer Protocol Negotiation • TLS extension of application layer ClientHello (ALPN extenstion + list of protocols) ServerHello (ALPN extenstion + selected protocol) ChangeCipherSpec Finished ChangeCipherSpec Finished
- 40. And more… • Inherently safe (because effectively only TLS) • Stream prioritisation • Flow control * A 12 B 4 * D 1 C 8 * D 1 C 8 A 12 B 4 * D 1 E 8 A 12 B 4 C 8
- 41. That's great, Piet. How about you show us some working code. You promised some action.” “
- 42. Nice pants, by the way.”“
- 44. HTTP/2 in action • Implementations in the wild • Roll your own HTTP/2-server • HTTP/2 on a bad network • Findings and recommendations • Sources
- 46. Terminology • ALPN: Application-Layer Protocol Negotiation, TLS extension to over negotiate on application layer protocol • NPN: precursor to ALPN • Upgrade: negotiation mechanism for HTTP/1.1 => HTTP/2 • Direct: connection without upgrade / negotiation • h2: HTTP/2 over TLS • h2c: HTTP/2 over TCP
- 47. Servers Name Version Negotiation Protocol Apache HTTP 2.4.17+ ALPN, Upgrade, direct h2, h2c NGINX 1.9.5+ ALPN, NPN, direct h2, h2c node-http2 ALPN, NPN, direct h2 Tomcat 8.5+ ALPN, Upgrade, direct h2, h2c http2 (Go) ALPN, NPN h2, h2-14 Jetty 9.3+ ALPN, Upgrade, direct h2, h2-17, h2-14, h2c, h2c-17 IIS 10 ? ? http-katana ALPN, Upgrade h2-12
- 48. Clients Name Version Negotiation Protocol Firefox 49+ ALPN, NPN h2-15, h2-14, h2 Chrome ALPN h2, h2-14 Internet Explorer Windows 10 ALPN h2 curl, libcurl ALPN, NPN, Upgrade h2-14, h2c-14 node-http2 ALPN, NPN, direct h2 http-katana ALPN, Upgrade h2-12 http2 (Go) ALPN, NPN h2, h2-14
- 49. Roll your own HTTP/2 server
- 50. Requirements • Java Development Kit (8+) • Eclipse Vert.x (reactive application toolkit for JVM) • netty-tcnative-boringssl-static (to dynamicly link TLS-support, no longer need in Java 9) • Some HTML, CSS and JavaScript files • A build / run tool (Gradle in this case) • A browser (for testing)
- 51. Application resources • HTML: index.html • JavaScript: application.js (pushed!) • Style sheet: style.css (pushed!) • Image: photo.jpg (pushed!)
- 52. Demo time! • Sources can be found at: https://github.com/pietvandongen/http2-brain-upgrade pull requests and issues are welcome! • The Docker container image is at: https://hub.docker.com/r/pietvandongen/http2-demo-server/
- 53. HTTP/2 on a bad network
- 54. Comparing HTTP/1.1 to HTTP/2 HTTP/2: Multiplexed + push HTTP/1.1: Sequential HTTP/1.1: Pipelined HTTP/2: Multiplexed
- 55. HTTP: high latency HTTP/2: Multiplexed + push HTTP/1.1: Sequential HTTP/1.1: Pipelined HTTP/2: Multiplexed
- 58. Findings and recommendations • Switch over, but use ALPN • Try before you asume (push!) • Start with a web project • Don't forget the decrypter during debugging • Read the documentation :)
- 59. Sources
- 60. Sources / literature • https://http2.github.io/: HTTP/2 homepage curated by IETF HTTP Working Group • https://developers.google.com/web/fundamentals/performance/ http2/: Introduction to HTTP/2 by Google • http://vertx.io/: Homepage of Eclipse Vert.x • Stephen Ludin & Javier Garza, Learning HTTP/2: A Practical Guide for Beginners (O'Reilly 2017) • https://hpbn.co/http2/: Chapter 12 of High Performance Browser Networking (Ilya Grigorik, O'Reilly 2013)
- 61. Any questions?
- 62. Any questions? • Mail me: piet.vandongen@luminis.eu • Tweet me: https://twitter.com/pietvandongen • Link me: https://www.linkedin.com/in/pietvandongencom/ • Visit me at Luminis (https://www.luminis.eu/)