The Web Experience Foundry will be dedicated to researching and prototyping projects and technologies that the Web Experience business unit feels are potentially important for the future of its product lines. The primary goals will be: - Gain a solid understanding of new technology and how it could (or could not) be used in Web Experience products (Discovery). - Prototype new technologies and create proof of concepts to validate or invalidate a technologies potential utility. - Research new concepts and look for ways they can improve our existing product lines.”

1. Foundry - HTTP/2
Stephen Ludin

2. ©2015 AKAMAI | FASTER FORWARDTM
Foundry’s Mission
“The Web Experience Foundry will be dedicated to researching and
prototyping projects and technologies that the Web Experience business
unit feels are potentially important for the future of its product lines. The
primary goals will be:
• Gain a solid understanding of new technology and how it could (or could not) be used in
Web Experience products (Discovery).
• Prototype new technologies and create proof of concepts to validate or invalidate a
technologies potential utility.
• Research new concepts and look for ways they can improve our existing product lines.”

3. ©2015 AKAMAI | FASTER FORWARDTM
“Take risks,
and fail fast”
The Web Experience Foundry Team

4. ©2015 AKAMAI | FASTER FORWARDTM
Why Change HTTP?

5. ©2015 AKAMAI | FASTER FORWARDTM
The Web has Changed

6. ©2015 AKAMAI | FASTER FORWARDTM
More page weight and interactivity

7. ©2015 AKAMAI | FASTER FORWARDTM
Understanding that
Performance == $$$

8. ©2015 AKAMAI | FASTER FORWARDTM
Mobile
AKA: A crappy device on a crappy network

9. ©2015 AKAMAI | FASTER FORWARDTM
What do we do today?

10. ©2015 AKAMAI | FASTER FORWARDTM
Spriting

11. ©2015 AKAMAI | FASTER FORWARDTM
Inlining
#globalheader { background:#707070;
background:
-o-linear-gradient(top, rgba(0, 0, 0, .2) 0, rgba(0, 0, 0, 0) 5%, rgba(0, 0, 0, 0) 97%, rgba(0, 0, 0, .45) 100%),
-o-linear-gradient(left, rgba(0, 0, 0, .2) 0, rgba(0, 0, 0, 0) .2%, rgba(0, 0, 0, 0) 99.8%, rgba(0, 0, 0, .2) 100%),
url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAA9QAAAAkCAMAAABfcIIyAAAAGXRFWHRTc...
-o-linear-gradient(bottom, #666 0, #5e5e5e 50%, #707070 51%, #808080 100%)
;
background:
-moz-linear-gradient(top, rgba(0, 0, 0, .2) 0, rgba(0, 0, 0, 0) 5%, rgba(0, 0, 0, 0) 97%, rgba(0, 0, 0, .45) 100%),
-moz-linear-gradient(left, rgba(0, 0, 0, .2) 0, rgba(0, 0, 0, 0) .2%, rgba(0, 0, 0, 0) 99.8%, rgba(0, 0, 0, .2) 100%),
url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAA9QAAAAkCAMAAABfcIIyAAAAGXRFWHRTb...
-moz-linear-gradient(bottom, #666 0, #5e5e5e 50%, #707070 51%, #808080 100%)
;
background:
-webkit-gradient(linear, 0 0, 0 100%, from(rgba(0, 0, 0, .2)), color-stop(0.05, rgba(0, 0, 0, 0)), color-stop(0.97...
-webkit-gradient(linear, 0 0, 100% 0, from(rgba(0, 0, 0, .2)), color-stop(0.002, rgba(0, 0, 0, 0)), color-stop(0.998,...
url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAA9QAAAAkCAMAAABfcIIyAAAAGXRFWHRTb2...
-webkit-gradient(linear, 0 100%, 0 0, from(#666), color-stop(0.5, #5e5e5e), color-stop(0.51, #707070), to(#808080))
;
}

12. ©2015 AKAMAI | FASTER FORWARDTM
Sharding

13. ©2015 AKAMAI | FASTER FORWARDTM
Concatenation

14. ©2015 AKAMAI | FASTER FORWARDTM
In other words… Hacks

15. ©2015 AKAMAI | FASTER FORWARDTM
So Why is HTTP/1 so expensive?

16. ©2015 AKAMAI | FASTER FORWARDTM
Insufficient use of TCP

17. ©2015 AKAMAI | FASTER FORWARDTM
Head of Line Blocking
Client Server
Time
?

18. ©2015 AKAMAI | FASTER FORWARDTM
TCP Slow Start

19. ©2015 AKAMAI | FASTER FORWARDTM
Uses of Multiple Connections

20. ©2015 AKAMAI | FASTER FORWARDTM
Headers are Verbose
GET / HTTP/1.1
Host: www.etsy.com
User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_8_2) AppleWebKit/536.26.14
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
DNT: 1
Accept-Language: en-us
Accept-Encoding: gzip, deflate
Cookie: uaid=uaid%3DVdhk5W6sexG-_Y7ZBeQFa3cq7yMQ%26_now%3D1325204464%26_slt%3Ds_LCLVpU
Connection: keep-alive
525 Bytes

21. ©2015 AKAMAI | FASTER FORWARDTM
Headers are Verbose
GET /assets/dist/js/etsy.recent-searches.20121001205006.js HTTP/1.1
Host: www.etsy.com
User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_8_2) AppleWebKit/536.26.14 (KHTML, like
Gecko) Version/6.0.1 Safari/536.26.14
Accept: */*
DNT: 1
Referer: http://www.etsy.com/
Accept-Language: en-us
Accept-Encoding: gzip, deflate
Cookie: autosuggest_split=1;etala=111461200.1476767743.1349274889.1349274889.1349274889.1.0;
Connection: keep-alive
226 New Bytes; 690 Total

22. ©2015 AKAMAI | FASTER FORWARDTM
Headers are Verbose
GET /assets/dist/js/jquery.appear.20121001205006.js HTTP/1.1
Host: www.etsy.com
User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_8_2) AppleWebKit/536.26.14 (KHTML
Accept: */*
DNT: 1
Referer: http://www.etsy.com/
Accept-Language: en-us
Accept-Encoding: gzip, deflate
Cookie: autosuggest_split=1;etala=111461200.1476767743.1349274889.1349274889.1349274889.1.0;
Connection: keep-alive
14 New Bytes; 683 Total

23. ©2015 AKAMAI | FASTER FORWARDTM
Headers are Verbose
GET /assets/dist/js/bootstrap/username-suggester.20121001205006.js HTTP/1.1
Host: www.etsy.com
User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_8_2) AppleWebKit/536.26.14 (KHTML
Accept: */*
DNT: 1
Referer: http://www.etsy.com/
Accept-Language: en-us
Accept-Encoding: gzip, deflate
Cookie: autosuggest_split=1;etala=111461200.1476767743.1349274889.1349274889.1349274889.1.0;
Connection: keep-alive
28 New Bytes; 698 Total

24. ©2015 AKAMAI | FASTER FORWARDTM
Headers are Verbose
Four Requests
• 2596 Bytes Total
• ~3 Packets in most places
• 1797 Redundant bytes ( 70% )

25. ©2015 AKAMAI | FASTER FORWARDTM
Depressed yet?

26. ©2015 AKAMAI | FASTER FORWARDTM
HTTP/2

27. ©2015 AKAMAI | FASTER FORWARDTM
In the beginning…
Never

28. ©2015 AKAMAI | FASTER FORWARDTM

29. ©2015 AKAMAI | FASTER FORWARDTM
HTTP/2
It is expected that HTTP/2 will:
• Substantially and measurably improve end-user perceived latency in most cases, over
HTTP/1.1 using TCP.
• Address the "head of line blocking" problem in HTTP.
• Not require multiple connections to a server to enable parallelism, thus improving its use
of TCP, especially regarding congestion control.
• Retain the semantics of HTTP/1.1, including (but not limited to) HTTP methods, status
codes, URIs, and where appropriate, header fields.

30. ©2015 AKAMAI | FASTER FORWARDTM
HTTP/2
Put more simply:
• Multiplexing
• Header compression
• Push
• Prioritization

31. ©2015 AKAMAI | FASTER FORWARDTM
HTTP/2 - Multiplexing
Client Server
Time
Client Server
Time
Saved
Time

32. ©2015 AKAMAI | FASTER FORWARDTM
HTTP/2 - Prioritization
Allow the user-agent to say what it thinks is most
important.
• Because of multiplexing the server can prioritize that objects
Time

33. ©2015 AKAMAI | FASTER FORWARDTM
HTTP/2 - Compression
Adds header compression:
• Average header size ~512 bytes now
• Over ~50 objects on a page that is 25K just in requests
• Compression can being that down to a tenth of that
• Result: all requests sent in a single round trip

34. ©2015 AKAMAI | FASTER FORWARDTM

35. ©2015 AKAMAI | FASTER FORWARDTM
HTTP/2 - Server Push
Generally, the server knows what a user-agent is
going to need before it is asked for.
Example: Prefetching
Client Server
Time

36. ©2015 AKAMAI | FASTER FORWARDTM
HTTP/2 - Extensible Frames
HEADER DATA SPECIAL DATA

37. ©2015 AKAMAI | FASTER FORWARDTM
Where are we?

38. ©2015 AKAMAI | FASTER FORWARDTM
h2 Timeline
2009 2011 2013
Google
announces
SPDY/2
SPDY
at
IETF80
Firefox ships SPDY
Call for HTTP/2
proposals
HTTPbis
rechartered for
HTTP/2
Akamai
announces
SPDY support

39. ©2015 AKAMAI | FASTER FORWARDTM
h2 Timeline
2013 2014
Draft-00 Draft-04
Draft-06
Draft-09 Draft-12 Draft-14 Draft-16
2015

40. ©2015 AKAMAI | FASTER FORWARDTM
Over 20 Implementations
Including 3 from Akamai

41. ©2015 AKAMAI | FASTER FORWARDTM
So What does it mean for me?

42. ©2015 AKAMAI | FASTER FORWARDTM
Faster
10-25%*

43. ©2015 AKAMAI | FASTER FORWARDTM
Simpler
Inlining Spriting Concatenation Sharding

44. ©2015 AKAMAI | FASTER FORWARDTM
New Connection Handling
What does failover, load balancing, and timeout mean?

45. ©2015 AKAMAI | FASTER FORWARDTM
TLS

46. ©2015 AKAMAI | FASTER FORWARDTM
Debugging

47. ©2015 AKAMAI | FASTER FORWARDTM
Getting from h1 to h2
HTTP/1 is Entrenched
• Wide use
• Large variety of implementations
• Intermediaries
Upgrade Paths
• HTTPS URLs – ALPN
• HTTP URLs – Upgrade ‘dance’, and ‘hints’
• Opportunistic Security

48. ©2015 AKAMAI | FASTER FORWARDTM
But for you:

49. ©2015 AKAMAI | FASTER FORWARDTM
HTTP/2 – The Goal
We will have HTTP/2 on the network in the fall.

50. ©2015 AKAMAI | FASTER FORWARDTM
HTTP/2 – The Goal
We will have HTTP/2 on the network in the fall.
We will have HTTP/2 on the network in January.

51. ©2015 AKAMAI | FASTER FORWARDTM
HTTP/2 – The Goal
We will have HTTP/2 on the network in the fall.
We will have HTTP/2 on the network in January.
We will have HTTP/2 on the network in March.

52. ©2015 AKAMAI | FASTER FORWARDTM
HTTP/2 – The Goal
We will have HTTP/2 on the network in the fall.
We will have HTTP/2 on the network in January.
We will have HTTP/2 on the network in March.
Ready for Experimentation Today

53. ©2015 AKAMAI | FASTER FORWARDTM
Very rough timeline
BETA CHANNEL
LAUNCH
GENERAL
AVAILABILITY
HTTP/2-ENABLED
FEATURES
Opt-in
• Edge to client only
• Secure network only
• Web Performance products
Opt-out
• Edge to client only
• Likely additional networks
• Likely additional product lines
TBD
• Candidate examples:
- Predictive Server Push
- Smart Stream Priorities
- HTTP/2 to origin
Expected Chrome,
Firefox, and IE support
2H2014 2H2015 1H2016

54. ©2015 AKAMAI | FASTER FORWARDTM
The Beta Channel
An opt-in program to provide our boundary-pushing customers with
access to our newest technologies, before general availability
• Get notified of all beta releases
• New features automatically available in Luna Control Portal
• Current features: SPDY and Predictive Prefetching
• Contact your account team to sign the T&Cs and subscribe