Slide 1
Slide 1 text
HTTP/2.0
[SPeeDY]
Andreas Bjärlestam (@bjarlestam)! 2013-03-15!
Slide 2
Slide 2 text
Something
strange
happened
last
year
Slide 3
Slide 3 text
You
know
HTTP?
Slide 4
Slide 4 text
It
has
been
replaced!*
*at
several
of
the
biggest
sites
on
the
web
Slide 5
Slide 5 text
And
no-‐one
has
noJced
Slide 6
Slide 6 text
Why
the
hell
would
you
want
to
replace
HTTP?
Slide 7
Slide 7 text
HTTP
is
fantasJc
it
has
totally
changed
the
world
Slide 8
Slide 8 text
but…
Slide 9
Slide 9 text
HTTP
is
over
20
years
old
HTTP
1.1
is
12
years
old
Slide 10
Slide 10 text
Webpages
in
1999
Slide 11
Slide 11 text
No content
Slide 12
Slide 12 text
Webpages
in
2013
Slide 13
Slide 13 text
No content
Slide 14
Slide 14 text
Mobile
internet
usage
source:
svenskarna
och
internet
2012
hRps://www.iis.se/docs/SOI2012.pdf
Slide 15
Slide 15 text
This
is
how
more
and
more
of
us
consume
the
web…
Slide 16
Slide 16 text
OTen
it
feels
a
lot
like…
Slide 17
Slide 17 text
People
no
longer
have
paJence
to
wait
for
slow
pages
Slide 18
Slide 18 text
$peed
Performance
==
$$
Slide 19
Slide 19 text
Being
slow
has
a
strong
negaJve
impact
on
business
The
cost
of
being
slow
increases
over
Jme
and
persists
Slide 20
Slide 20 text
Myth:
If
your
site
loads
in
under
4
seconds
you
are
ok
Actually:
The
negaJve
impact
of
being
slow
increases
linearly!
Slide 21
Slide 21 text
Bounce
rate
increases
linearly
with
page
load
Jme
Search
engines
rank
faster
sites
higher
Slide 22
Slide 22 text
Bandwidth
doesn’t
maRer
much
anymore
Latency
does
Slide 23
Slide 23 text
Bandwidth
Page
Load
Time
1Mbps
3Mbps
9Mbps
Latency
Page
Load
Time
240ms
120ms
20ms
Slide 24
Slide 24 text
Web
pages
March
2013
• www.facebook.com
-‐
ca
170
hRp
requests
• www.bostonglobe.com
-‐
ca
150
hRp
requests
• www.svtplay.se
-‐
ca
50
hRp
requests
• www.aTonbladet.se
-‐
ca
450
hRp
requests
source:
hRp://hRparchive.org/
Slide 25
Slide 25 text
What
does
it
look
like
over
the
network
fetching
150
resources?
Slide 26
Slide 26 text
No content
Slide 27
Slide 27 text
Can
you
spot
the
problem?
Slide 28
Slide 28 text
Its
all
synchronous
Slide 29
Slide 29 text
How
come
an
advanced
page
like
facebook.com
loads
in
under
4
seconds
when
its
all
synchronous?
Slide 30
Slide 30 text
Hacky
opJmizaJons
CSS
sprites
base64
images
in
data-‐urls
CSS
concatenaJon
JavaScript
concatenaJon
Slide 31
Slide 31 text
HTTP/TCP
HTTP/TCP
HTTP/TCP
HTTP/TCP
HTTP/TCP
HTTP/TCP
6
x
HTTP
connecJons
Slide 32
Slide 32 text
Domain
sharding
• www.bostonglobe.com
-‐
25
domains
• www.svtplay.se
-‐
9
domains
• www.aTonbladet.se
-‐
42
domains
source:
hRp://www.webpagetest.org
Slide 33
Slide 33 text
What
is
the
problem
with
this?
Why
not
even
more
connecJons?
Slide 34
Slide 34 text
We
kind
of
abuse
TCP
when
we
open
more
connecJons
Slide 35
Slide 35 text
2
connecJons
per
host
recommended
by
HTTP
1.1
spec
6
connecJons
in
most
browsers
Slide 36
Slide 36 text
and…
Slide 37
Slide 37 text
New
TCP
connecJons
are
slow
Slide 38
Slide 38 text
3
way
handshake
Slide 39
Slide 39 text
On
my
macbook
Ping
20ms
≈
30ms
to
set
up
a
connecJon
On
my
mobile
(3G)
Ping
300ms
≈
450ms
to
set
up
a
connecJon
Slide 40
Slide 40 text
HTTP/TCP
HTTP/TCP
HTTP/TCP
HTTP/TCP
HTTP/TCP
TCP
Slow
start
HTTP/TCP
Slide 41
Slide 41 text
Window
size
1
2
3
4
5
6
7
8
roundtrips
TCP
Slow
start
Packet
loss
Slide 42
Slide 42 text
So…
we
need
to
uJlize
our
TCP
connecJons
beRer
Slide 43
Slide 43 text
Enter
Slide 44
Slide 44 text
Don’t
we
break
the
web
if
we
replace
HTTP?
Slide 45
Slide 45 text
Nope
Slide 46
Slide 46 text
The
semanJcs
of
HTTP
is
kept
Slide 47
Slide 47 text
HTTP
-‐>
SPDY
GET
PUT
POST
…
HEADERS
Use
of
URLs
Use
of
TCP
GET
PUT
POST
…
HEADERS
Use
of
URLs
Use
of
TCP
Slide 48
Slide 48 text
You
can
switch
to
SPDY
with
no
changes
to
your
web
applicaJon
Slide 49
Slide 49 text
Example…
Slide 50
Slide 50 text
Designed
with
speed
as
primary
goal
Slide 51
Slide 51 text
1
TCP
connecJon
HTTP/TCP
Slide 52
Slide 52 text
HTTP/TCP
But
it
will
be
on
fire!
Slide 53
Slide 53 text
SPDY
is
mulJplexed
Slide 54
Slide 54 text
This
is
a
typical
HTTP
session
GET
GET
GET
200
OK
200
OK
200
OK
Slide 55
Slide 55 text
MulJplexing
GET
1
GET
2
GET
3
200
OK
2
200
OK
3
200
OK
1
Slide 56
Slide 56 text
Stream
prioriJes
Slide 57
Slide 57 text
SPDY
is
binary
Slide 58
Slide 58 text
HTTP
-‐>
SPDY
Slide 59
Slide 59 text
Will
be
difficult
to
just
fire
up
telnet
and
hack
away
Slide 60
Slide 60 text
Every
decent
site
will
be
encrypted
and
gzipped
anyways
Slide 61
Slide 61 text
curl
and
wireshark
will
sJll
be
your
friend
Slide 62
Slide 62 text
TLS/SSL
is
mandatory
✗
Slide 63
Slide 63 text
Simplest
way
to
avoid
problems
with
intermediaries
Slide 64
Slide 64 text
Headers
are
compressed
Slide 65
Slide 65 text
Server
Push
Slide 66
Slide 66 text
Server
Push
Slide 67
Slide 67 text
So
is
it
worth
it?
Slide 68
Slide 68 text
Many
studies
with
slightly
different
results
Most
of
them
indicate
a
significant
speedup
(10%
–
60%)
hRps://code.google.com/p/mod-‐spdy
Slide 69
Slide 69 text
SPDY
could
make
your
life
easier
No
more
hacky
opJmizaJons
like
CSS
sprites,
file
concatenaJons,
domain
sharding
etc
Slide 70
Slide 70 text
We
need
to
unlearn
some
habits
unshard
Slide 71
Slide 71 text
ImplementaJons
• Apache
mod_spdy
• Nginx
• node_spdy
• NeRy
• JeRy
• HAProxy
• more…
Slide 72
Slide 72 text
Browsers
• Chrome
6+
• Firefox
13+
• Opera
12.10+
• Amazon
silk
>
50%
of
browsers
support
SPDY
Slide 73
Slide 73 text
Google
• Support
SPDY
on
all
their
services
(gmail
etc)
• Most
of
their
SSL
traffic
is
over
SPDY
Slide 74
Slide 74 text
Others
• Akamai
(Contendo)
• Strangeloop
• F5
BIG-‐IP
• TwiRer
• Facebook
• Wordpress
• Amazon
(kindle
fire
silkbrowser)
Slide 75
Slide 75 text
Amazon
silk
Silk
Browser
SPDY
Gateway
The
Internet
SPDY
HTTP
Google
has
introduced
a
similar
thing
in
chrome
for
android
(beta
version)
Slide 76
Slide 76 text
The
spec
• DraT
spec,
version
4
• IETF
has
started
to
work
on
HTTP/2.0
• SPDY
has
been
agreed
to
be
the
starJng
point
for
HTTP/2.0
Slide 77
Slide 77 text
Roundup
• Faster
page
loads
than
HTTP
• Backwards
compaJble
with
HTTP
• BeRer
uJlizaJon
of
TCP
• Secured
by
default
• Binary
+
compressed
Slide 78
Slide 78 text
ARribuJons
• hRp://en.wikipedia.org/wiki/
File:US_RoboJcs_56K_Modem_Front.JPG
• hRps://www.iis.se/docs/SOI2012.pdf
• hRp://www.flickr.com/photos/howi/6366423373/
• hRp://www.flickr.com/photos/wwarby/5110037138/
• hRp://www.flickr.com/photos/alicetragedy/
4977295298/
• hRp://www.flickr.com/photos/koltregaskes/
624914973/in/photostream/
Slide 79
Slide 79 text
Backup
slides
Slide 80
Slide 80 text
HTTP
Pipelining
• Not
as
effecJve
as
mulJplexing
• Hard
to
implement
in
browser
• Opera
is
the
only
desktop
browser
that
has
a
full
implementaJon
enabled
by
default
• Android,
IOS5
and
Opera
mobile
browsers
do
some
amount
of
pipelining
• Not
used
by
most
proxies
Slide 81
Slide 81 text
Pipelining
GET
1
GET
2
GET
3
200
OK
1
200
OK
2
200
OK
3
GET
1
GET
2
GET
3
200
OK
2
200
OK
3
200
OK
1
MulJplexing
GET
GET
GET
200
OK
200
OK
200
OK
Synchronous