For anyone who writes code for the web, transitioning to HTTP/2 isn't straightforward and a speed boost isn’t automatically guaranteed. The new protocol challenges common wisdom when building performant web applications and many existing tools like debugging proxies don't support it yet. This talk is an introduction to the new HTTP/2 protocol and how it changes web performance best practices.
HTTP2 is web
Clay Smith, New Relic
Forward 4 Web Technology Summit - February 10, 2016
This talk covers
Introduction to the HTTP/2 protocol for
How HTTP/2 changes web performance
Practical HTTP/2 debugging
Hypertext Transfer Protocol (often
abbreviated to HTTP) is a communications
protocol. It is used to send and receive
webpages and ﬁles on the internet.
HTTP 1.1 is nearly 20
It's the main application protocol of
HTTP 1.1 User-Agent:
telnet forwardjs.com 80
GET / HTTP/1.1
CyberTrend #1: We keep
CyberTrend #2: More
bytes over the wire
We're in the "Website
CC SA A ﬂickr.com/photos/yukariryu/122530943
HTTP 1.1 is still
partying like it's 1997
"It's king of the web"
- Not from Titanic
SPDY became HTTP2
Ratiﬁed by the IETF in May 2015
caniuse.com: ~62% global browser support
CC SA A ﬂickr.com/photos/[email protected]/6813140711
+ TLS = HTTPS
+ TLS = HTTPS
a single TCP connection (sans TLS)
HTTP/2 has many streams
A stream is bi-directional with one or
more messages, an ID, and priority
Messages are composed of frames,
the "fundamental unit" of HTTP/2
Frames have different types and are
blended. They are reassembled into
messages using the stream ID.
THE FRAMES ARE
What changes in
web perf best
Aside: Latency and
Speed in Fiber
SFO London 5,375 mi 42 ms
SFO Tokyo 5,124 mi 40 ms
SFO Auckland 6,516 mi 51 ms
SFO Capetown 10,124 mi 79 ms
HTTP can't travel faster than the speed of light.
TCP Multiplexing is a
Multiple messages can share the same TCP
connection without blocking each other or
creating additional connections.
Goodbye old web
• Domain sharding
• CSS Concatenation
• Inlining assets (including Base64 encoding)
Unbundle and cache
the little files
Compression performance may be
impacted with hundreds of small ﬁles.
• Headers are
compressed in HTTP/
• Uses the HPACK
algorithm (part of the
• Reduced overall
Important: HTTPS is
support using TLS
$ openssl s_client -servername google.com -
connect google.com:443 -nextprotoneg ''
Protocols advertised by server: h2, spdy/3.1,
TLS extension called Application Layer Protocol Negotiation
(ALPN) that determine what application protocol to use. Must use
OpenSSL > 1.0.2.
Might want to get an extended
validation (EV) certiﬁcate?
Check out letsencrypt.org
• Streams: very cool (server-side push)
• Request prioritization
• Exotic HTTP/2 binary frame types (PING,
• Further reading: http://daniel.haxx.se/http2/
with Wireshark 2
Capture secret keys
from Firefox or Chrome
$ export SSLKEYLOGFILE=~/Desktop/tls_fun.log
$ open -a Google\ Chrome https://
Good tutorial on this: https://jimshaver.net/2015/02/11/decrypting-tls-browser-
Point Wireshark to the
Filter traffic on port
Debug all the frames
View frames directly in Chrome
What about old
of the site?
Difﬁcult questions when implementing HTTP/2.
How do I eat this
Backends must be updated (if possible)
I want to eat this
CDNs can talk HTTP/2 to browsers that support it.
Origin CDN Browser
HTTP 1.1 HTTP/2
Usage by site trafﬁc
HTTP/2 isn't as
popular as... ETag
People just want the
web to be fast and work
HTTP/2 will likely help when correctly implemented.
HTTP2 is sweet
Slides posted in ~30 seconds on
@smithclay + #forwardjs
Blog post: http://bit.ly/http2candy