HTTP by Hand: Exploring HTTP/1.0, 1.1 and 2.0
-
Upload
cory-forsyth -
Category
Technology
-
view
1.729 -
download
0
description
Transcript of HTTP by Hand: Exploring HTTP/1.0, 1.1 and 2.0
![Page 1: HTTP by Hand: Exploring HTTP/1.0, 1.1 and 2.0](https://reader033.fdocuments.net/reader033/viewer/2022052907/5591b2281a28ab32518b47f0/html5/thumbnails/1.jpg)
HTTP by
@bantic Cory Forsyth
HandExploring HTTP/1.x
Looking forward to HTTP/2
![Page 2: HTTP by Hand: Exploring HTTP/1.0, 1.1 and 2.0](https://reader033.fdocuments.net/reader033/viewer/2022052907/5591b2281a28ab32518b47f0/html5/thumbnails/2.jpg)
201 Created
We build õ-age apps with Ember.js. We take teams from £ to • in no time flat.
![Page 3: HTTP by Hand: Exploring HTTP/1.0, 1.1 and 2.0](https://reader033.fdocuments.net/reader033/viewer/2022052907/5591b2281a28ab32518b47f0/html5/thumbnails/3.jpg)
Why by hand?
• Why let browsers have all the fun?
• HTTP is human-scale
![Page 4: HTTP by Hand: Exploring HTTP/1.0, 1.1 and 2.0](https://reader033.fdocuments.net/reader033/viewer/2022052907/5591b2281a28ab32518b47f0/html5/thumbnails/4.jpg)
How we (a)buse HTTP
• Asset host sharding
• Concatenation
• Spriting
![Page 5: HTTP by Hand: Exploring HTTP/1.0, 1.1 and 2.0](https://reader033.fdocuments.net/reader033/viewer/2022052907/5591b2281a28ab32518b47f0/html5/thumbnails/5.jpg)
What is HTTP?
![Page 6: HTTP by Hand: Exploring HTTP/1.0, 1.1 and 2.0](https://reader033.fdocuments.net/reader033/viewer/2022052907/5591b2281a28ab32518b47f0/html5/thumbnails/6.jpg)
Let’s get some HTMLHTTP/0.9
![Page 7: HTTP by Hand: Exploring HTTP/1.0, 1.1 and 2.0](https://reader033.fdocuments.net/reader033/viewer/2022052907/5591b2281a28ab32518b47f0/html5/thumbnails/7.jpg)
![Page 8: HTTP by Hand: Exploring HTTP/1.0, 1.1 and 2.0](https://reader033.fdocuments.net/reader033/viewer/2022052907/5591b2281a28ab32518b47f0/html5/thumbnails/8.jpg)
HTML!
![Page 9: HTTP by Hand: Exploring HTTP/1.0, 1.1 and 2.0](https://reader033.fdocuments.net/reader033/viewer/2022052907/5591b2281a28ab32518b47f0/html5/thumbnails/9.jpg)
HTTP/0.9One-line Request Format
GET /
Not really a spec
![Page 10: HTTP by Hand: Exploring HTTP/1.0, 1.1 and 2.0](https://reader033.fdocuments.net/reader033/viewer/2022052907/5591b2281a28ab32518b47f0/html5/thumbnails/10.jpg)
Let’s get some HTMLHTTP/1.0
![Page 11: HTTP by Hand: Exploring HTTP/1.0, 1.1 and 2.0](https://reader033.fdocuments.net/reader033/viewer/2022052907/5591b2281a28ab32518b47f0/html5/thumbnails/11.jpg)
HTTP/1.0 Spec
Request = Request-Line ; Section 5.1 *(( general-header ; Section 4.5 | request-header ; Section 5.3 | entity-header ) CRLF) ; Section 7.1
CRLF [ message-body ] ; Section 4.3
Line break
Request
![Page 12: HTTP by Hand: Exploring HTTP/1.0, 1.1 and 2.0](https://reader033.fdocuments.net/reader033/viewer/2022052907/5591b2281a28ab32518b47f0/html5/thumbnails/12.jpg)
HTTP/1.0 Spec
Request-Line = Method SP Request-URI SP HTTP-Version CRLF
Request-Line
![Page 13: HTTP by Hand: Exploring HTTP/1.0, 1.1 and 2.0](https://reader033.fdocuments.net/reader033/viewer/2022052907/5591b2281a28ab32518b47f0/html5/thumbnails/13.jpg)
HTTP/1.0 Spec
Request-Line = GET / HTTP/1.0
Request-Line
![Page 14: HTTP by Hand: Exploring HTTP/1.0, 1.1 and 2.0](https://reader033.fdocuments.net/reader033/viewer/2022052907/5591b2281a28ab32518b47f0/html5/thumbnails/14.jpg)
![Page 15: HTTP by Hand: Exploring HTTP/1.0, 1.1 and 2.0](https://reader033.fdocuments.net/reader033/viewer/2022052907/5591b2281a28ab32518b47f0/html5/thumbnails/15.jpg)
HTML!
![Page 16: HTTP by Hand: Exploring HTTP/1.0, 1.1 and 2.0](https://reader033.fdocuments.net/reader033/viewer/2022052907/5591b2281a28ab32518b47f0/html5/thumbnails/16.jpg)
Quick Aside: TCP
![Page 17: HTTP by Hand: Exploring HTTP/1.0, 1.1 and 2.0](https://reader033.fdocuments.net/reader033/viewer/2022052907/5591b2281a28ab32518b47f0/html5/thumbnails/17.jpg)
Quick Aside: TCPClient Server
syn
syn ack
ack
3-Way Handshake
![Page 18: HTTP by Hand: Exploring HTTP/1.0, 1.1 and 2.0](https://reader033.fdocuments.net/reader033/viewer/2022052907/5591b2281a28ab32518b47f0/html5/thumbnails/18.jpg)
• Minimum 1 Round Trip Per Request
• Can’t make speed of light faster
• How can we avoid this latency?
Quick Aside: TCP
![Page 19: HTTP by Hand: Exploring HTTP/1.0, 1.1 and 2.0](https://reader033.fdocuments.net/reader033/viewer/2022052907/5591b2281a28ab32518b47f0/html5/thumbnails/19.jpg)
How we (a)buse HTTP
Sprite all the things!!
![Page 20: HTTP by Hand: Exploring HTTP/1.0, 1.1 and 2.0](https://reader033.fdocuments.net/reader033/viewer/2022052907/5591b2281a28ab32518b47f0/html5/thumbnails/20.jpg)
HTTP/1.0 Spec
“requires … the connection be … closed by the server after sending the response.”
One connection, one response
–HTTP/1.0 Spec
![Page 21: HTTP by Hand: Exploring HTTP/1.0, 1.1 and 2.0](https://reader033.fdocuments.net/reader033/viewer/2022052907/5591b2281a28ab32518b47f0/html5/thumbnails/21.jpg)
![Page 22: HTTP by Hand: Exploring HTTP/1.0, 1.1 and 2.0](https://reader033.fdocuments.net/reader033/viewer/2022052907/5591b2281a28ab32518b47f0/html5/thumbnails/22.jpg)
HTTP/1.1 Spec
“HTTP/1.1 servers SHOULD maintain persistent connections”
–HTTP/1.1 Spec
![Page 23: HTTP by Hand: Exploring HTTP/1.0, 1.1 and 2.0](https://reader033.fdocuments.net/reader033/viewer/2022052907/5591b2281a28ab32518b47f0/html5/thumbnails/23.jpg)
Let’s get some HTMLHTTP/1.1
![Page 24: HTTP by Hand: Exploring HTTP/1.0, 1.1 and 2.0](https://reader033.fdocuments.net/reader033/viewer/2022052907/5591b2281a28ab32518b47f0/html5/thumbnails/24.jpg)
![Page 25: HTTP by Hand: Exploring HTTP/1.0, 1.1 and 2.0](https://reader033.fdocuments.net/reader033/viewer/2022052907/5591b2281a28ab32518b47f0/html5/thumbnails/25.jpg)
Persistent connection!
![Page 26: HTTP by Hand: Exploring HTTP/1.0, 1.1 and 2.0](https://reader033.fdocuments.net/reader033/viewer/2022052907/5591b2281a28ab32518b47f0/html5/thumbnails/26.jpg)
HTTP/1.1 Spec
“A client … MAY … send multiple requests without waiting for each response.”
–HTTP/1.1 Spec
Pipelining
“A server MUST [respond] in the same order that the requests were received.”
![Page 27: HTTP by Hand: Exploring HTTP/1.0, 1.1 and 2.0](https://reader033.fdocuments.net/reader033/viewer/2022052907/5591b2281a28ab32518b47f0/html5/thumbnails/27.jpg)
Let’s get some (local) HTML
HTTP/1.1 Pipelining
![Page 28: HTTP by Hand: Exploring HTTP/1.0, 1.1 and 2.0](https://reader033.fdocuments.net/reader033/viewer/2022052907/5591b2281a28ab32518b47f0/html5/thumbnails/28.jpg)
Request #1Request #2
Response #1
Response #2
![Page 29: HTTP by Hand: Exploring HTTP/1.0, 1.1 and 2.0](https://reader033.fdocuments.net/reader033/viewer/2022052907/5591b2281a28ab32518b47f0/html5/thumbnails/29.jpg)
–Web Developer Guy
“I’ll let the browser pipeline all my assets.”
![Page 30: HTTP by Hand: Exploring HTTP/1.0, 1.1 and 2.0](https://reader033.fdocuments.net/reader033/viewer/2022052907/5591b2281a28ab32518b47f0/html5/thumbnails/30.jpg)
Let’s get some (blocked) HTML
HTTP/1.1 Head-of-Line Blocking
![Page 31: HTTP by Hand: Exploring HTTP/1.0, 1.1 and 2.0](https://reader033.fdocuments.net/reader033/viewer/2022052907/5591b2281a28ab32518b47f0/html5/thumbnails/31.jpg)
Head-of-Line Blocking
Waiting on Request #1
![Page 32: HTTP by Hand: Exploring HTTP/1.0, 1.1 and 2.0](https://reader033.fdocuments.net/reader033/viewer/2022052907/5591b2281a28ab32518b47f0/html5/thumbnails/32.jpg)
HTTP/1.1 Spec
–HTTP/1.1 Spec
Pipelining
“A server MUST [respond] in the same order that the requests were received.”
![Page 33: HTTP by Hand: Exploring HTTP/1.0, 1.1 and 2.0](https://reader033.fdocuments.net/reader033/viewer/2022052907/5591b2281a28ab32518b47f0/html5/thumbnails/33.jpg)
How we (a)buse HTTP
Asset Host Sharding!
![Page 34: HTTP by Hand: Exploring HTTP/1.0, 1.1 and 2.0](https://reader033.fdocuments.net/reader033/viewer/2022052907/5591b2281a28ab32518b47f0/html5/thumbnails/34.jpg)
Let’s Serve some HTML
HTTP/1.1
![Page 35: HTTP by Hand: Exploring HTTP/1.0, 1.1 and 2.0](https://reader033.fdocuments.net/reader033/viewer/2022052907/5591b2281a28ab32518b47f0/html5/thumbnails/35.jpg)
HTTP/1.1 Spec
Response = Status-Line ; Section 6.1 *(( general-header ; Section 4.5 | response-header ; Section 6.2 | entity-header ) CRLF) ; Section 7.1
CRLF [ message-body ] ; Section 7.2
Response
![Page 36: HTTP by Hand: Exploring HTTP/1.0, 1.1 and 2.0](https://reader033.fdocuments.net/reader033/viewer/2022052907/5591b2281a28ab32518b47f0/html5/thumbnails/36.jpg)
HTTP/1.1 Spec
Status-Line = HTTP-Version SP Status-Code SP Reason-Phrase CRLF
Line break
Status-Line
![Page 37: HTTP by Hand: Exploring HTTP/1.0, 1.1 and 2.0](https://reader033.fdocuments.net/reader033/viewer/2022052907/5591b2281a28ab32518b47f0/html5/thumbnails/37.jpg)
HTTP/1.1 Spec
Status-Line = HTTP/1.1 201 Created
Line break
Status-Line
![Page 38: HTTP by Hand: Exploring HTTP/1.0, 1.1 and 2.0](https://reader033.fdocuments.net/reader033/viewer/2022052907/5591b2281a28ab32518b47f0/html5/thumbnails/38.jpg)
HTTP/1.1 Spec
The presence of a message-body … is signaled by the inclusion of a Content-Length or Transfer-
Encoding header field
–HTTP/1.1 Spec
Message Headers
![Page 39: HTTP by Hand: Exploring HTTP/1.0, 1.1 and 2.0](https://reader033.fdocuments.net/reader033/viewer/2022052907/5591b2281a28ab32518b47f0/html5/thumbnails/39.jpg)
HTTP/1.1 Spec
HTTP/1.1 200 OK Content-Type: text/html Content-Length: 38 !<html> <body>Hello, world</body> </html>
Example HTTP Response
Status-Line
Headers
message-body
![Page 40: HTTP by Hand: Exploring HTTP/1.0, 1.1 and 2.0](https://reader033.fdocuments.net/reader033/viewer/2022052907/5591b2281a28ab32518b47f0/html5/thumbnails/40.jpg)
Request Headers
Request-Line
Artisanal, Small-batch
HTTP
$ nc -l 3000
![Page 41: HTTP by Hand: Exploring HTTP/1.0, 1.1 and 2.0](https://reader033.fdocuments.net/reader033/viewer/2022052907/5591b2281a28ab32518b47f0/html5/thumbnails/41.jpg)
Let’s Serve (dynamic-length) HTML
HTTP/1.1Transfer-Encoding: chunked
![Page 42: HTTP by Hand: Exploring HTTP/1.0, 1.1 and 2.0](https://reader033.fdocuments.net/reader033/viewer/2022052907/5591b2281a28ab32518b47f0/html5/thumbnails/42.jpg)
HTTP/1.1
<chunk-length> chunk
<chunk-length> chunk
0
Transfer-Encoding: chunked
![Page 43: HTTP by Hand: Exploring HTTP/1.0, 1.1 and 2.0](https://reader033.fdocuments.net/reader033/viewer/2022052907/5591b2281a28ab32518b47f0/html5/thumbnails/43.jpg)
$ nc -l 3000
![Page 44: HTTP by Hand: Exploring HTTP/1.0, 1.1 and 2.0](https://reader033.fdocuments.net/reader033/viewer/2022052907/5591b2281a28ab32518b47f0/html5/thumbnails/44.jpg)
HTTP/2
![Page 45: HTTP by Hand: Exploring HTTP/1.0, 1.1 and 2.0](https://reader033.fdocuments.net/reader033/viewer/2022052907/5591b2281a28ab32518b47f0/html5/thumbnails/45.jpg)
What is HTTP/2 not?
![Page 46: HTTP by Hand: Exploring HTTP/1.0, 1.1 and 2.0](https://reader033.fdocuments.net/reader033/viewer/2022052907/5591b2281a28ab32518b47f0/html5/thumbnails/46.jpg)
• Same HTTP methods (GET, PUT, etc)
• Same usage of headers
• Same use cases
• Still one client, one server
![Page 47: HTTP by Hand: Exploring HTTP/1.0, 1.1 and 2.0](https://reader033.fdocuments.net/reader033/viewer/2022052907/5591b2281a28ab32518b47f0/html5/thumbnails/47.jpg)
What is HTTP/2 is?
![Page 48: HTTP by Hand: Exploring HTTP/1.0, 1.1 and 2.0](https://reader033.fdocuments.net/reader033/viewer/2022052907/5591b2281a28ab32518b47f0/html5/thumbnails/48.jpg)
• One TCP connection
• Binary! (Different transfer mechanism)
• Header compression
• Upgrade path
![Page 49: HTTP by Hand: Exploring HTTP/1.0, 1.1 and 2.0](https://reader033.fdocuments.net/reader033/viewer/2022052907/5591b2281a28ab32518b47f0/html5/thumbnails/49.jpg)
• One TCP connection
• Requests and Responses can cross
• Server push
• Prioritization
![Page 50: HTTP by Hand: Exploring HTTP/1.0, 1.1 and 2.0](https://reader033.fdocuments.net/reader033/viewer/2022052907/5591b2281a28ab32518b47f0/html5/thumbnails/50.jpg)
• One TCP connection: implications
• Asset Host Sharding: bad!
• CSS/JS Concatenation: Unnecessary/bad!
• Image spriting: Unnecessary/bad!
![Page 51: HTTP by Hand: Exploring HTTP/1.0, 1.1 and 2.0](https://reader033.fdocuments.net/reader033/viewer/2022052907/5591b2281a28ab32518b47f0/html5/thumbnails/51.jpg)
• Binary
• HTTP/2: same semantics, different “on-the-wire” transport
• Can we still make small-batch HTTP/2? (Sorta?)
• More compact, easier to parse
• Mandatory compression
![Page 52: HTTP by Hand: Exploring HTTP/1.0, 1.1 and 2.0](https://reader033.fdocuments.net/reader033/viewer/2022052907/5591b2281a28ab32518b47f0/html5/thumbnails/52.jpg)
Where is HTTP/2?
![Page 53: HTTP by Hand: Exploring HTTP/1.0, 1.1 and 2.0](https://reader033.fdocuments.net/reader033/viewer/2022052907/5591b2281a28ab32518b47f0/html5/thumbnails/53.jpg)
SPDY• ~ 1% of all servers (2013)
• CloudFlare
![Page 55: HTTP by Hand: Exploring HTTP/1.0, 1.1 and 2.0](https://reader033.fdocuments.net/reader033/viewer/2022052907/5591b2281a28ab32518b47f0/html5/thumbnails/55.jpg)
HTTP by
@bantic Cory Forsyth
Hand
Thank you!