HTTP/2 BrightonSEO 2018

Tom Anthony
Distilled
An introduction to
HTTP/2 for SEOs
@TomAnthonySEO
https://www.slideshare.net/tomanthony/

500 MILE EMAIL
Connection timeout = 6 milliseconds
Speed of light = 299 792 458 m/s
Distance = 558 miles

HTTP
@TomAnthonySEO #brightonSEO

ANATOMY OF AN HTTP/1.1 REQUEST
GET /anchorman/ HTTP/1.1

Host: www.ronburgundy.com

Host: www.ronburgundy.com
User-Agent: my-browser

ANATOMY OF A RESPONSE
HTTP/1.1 200 OK
Content-Type: text/html HEADERS

ANATOMY OF A RESPONSE
HTTP/1.1 200 OK
Content-Type: text/html
<html>
<head>
<title>Ron’s Page</title>
</head>
<body>
You stay classy, San Diego!
</body>
</html>
HEADERS
BODY

1 REQUEST IS FOR 1 FILE

HTTP TRUCKS!
Imagine an HTTP request is a truck, sent from your
browser to a server to collect a web page.

TCP/IP & HTTP
TCP is the road; the transport layer for HTTP.

HTTP REQUESTS
Outbound trucks carry an HTTP request.
Request

HTTP RESPONSES
Returning trucks carry an HTTP response.
Response

PROBLEM! ANYONE CAN LOOK INTO PASSING TRUCKS
With HTTP, people could look into the trucks,
and find out all your secrets!!

HTTPS
With HTTPS the road is the same, but we drive through a tunnel.

HTTPS REQUESTS ARE IDENTICAL TO HTTP
The trucks in the tunnel are still exactly the same.

HTTP sounds great &
HTTPS is secure.
Why change?
?

PROBLEM #1: SMALL REQUESTS/RESPONSES STILL TAKE TIME
Even the fastest trucks can only
go at the speed of light!

LATENCY & ROUND TRIP TIMES
Longer roads mean it takes longer
for a response to come back.

PROBLEM #2: PAGES MADE OF MANY FILES (MANY REQUESTS)

NUMBER OF ASSETS ON PAGES HAS INCREASED

OFTEN 50-100 SEPARATE HTTP REQUESTS

PROBLEM #3) MOBILE CONNECTIONS INCREASE LATENCY

What does all of
this add up to?
!

BROWSER COLLECTING A PAGE
Imagine the browser wants to render a page.

EVERY ROUND TRIP TAKES TIME
50ms to get to the server.

Server takes 50ms
to make page.

50ms to get back to the browser.

HTML RESPONSE PROMPTS MORE ROUND TRIPS
Once it has the HMTL the browser
discovers it needs more files.

1 CONNECTION CAN HANDLE 1 REQUEST
Every truck needs its own road.

LUCKILY BROWSERS CAN HANDLE MULTIPLE CONNECTIONS
We can have more roads and more trucks.

BUT CONNECTIONS TAKE TIME TO OPEN
Think of it as a steamroller laying down the road.

BUT CONNECTIONS TAKE TIME TO OPEN
Opening a new connection requires a full round trip,
before we can send a truck down it.

BROWSERS TYPICALLY OPEN ABOUT 6 CONNECTIONS MAX
Opening more has diminishing returns,
and other issues. @TomAnthonySEO #brightonSEO

THIS MEANS SOME REQUESTS HAVE TO WAIT
Trucks have to queue line up for a road.

BLOCKED REQUESTS
Only 6 requests being run at a time.

DECREASING LATENCY IMPROVES THINGS A LOT
Short roads reduce truck waiting times,
and dramatically improve load times.
source: https://hpbn.co/primer-on-web-performance/ @TomAnthonySEO #brightonSEO

THIS IS WHY PEOPLE MADE SPRITE SETS

CDNS MOVE THINGS CLOSER & REDUCE LATENCY

MULTIPLEXING ALLOWS MANY REQUESTS PER CONNECTION
Now multiple trucks can be on the road at once!

HTTP/1.1 WATERFALL - BLOCKED REQUESTS

HTTP/2 WATERFALL - NO BLOCKING

HTTP2 REQUESTS ARE STILL THE SAME
The content of the trucks are still the same.
Just a new road / traffic management system!

HTTP/2 FORMAT IS THE SAME AS HTTP/1.1
GET /anchorman/ HTTP/2
host: www.ronburgundy.com
user-agent: my-browser

HEADER & BODY
HTTP/2 200
content-type: text/html
<html>
<head>
<title>Ron’s Page</title>
</head>
<body>
You stay classy, San Diego!
</body>
</html>
HEADERS
BODY

HTTP/2 RESPONSE CODES UNCHANGED
200 404301

HTTP2 ALLOWS ‘SERVER PUSH’
With Server Push, a single request is sent,
but the server sends multiple responses.

HTTP2 ALLOWS ‘SERVER PUSH’
If the server knows the HTML requires other assets,
it can send them back with the HTML.

HTTP2 REQUIRES HTTPS
In order to get the better traffic management, you need a tunnel!

Your devs don’t need to do anything!
The server does all the work.

CDNS CAN DO IT FOR YOU!
HTTP/2 between
visitors and CDN
HTTP/1.1 between
CDN and Server

Does Google notice
if I have HTTP/2?
?

GOOGLEBOT DOES NOT CRAWL
https://moz.com/blog/challenging-googlebot-experiment

THUS IT WON’T IMPROVE SCORES IN GSC
Google’s WRS doesn’t use it at all, currently.

BUT THAT ISN’T HOW GOOGLE EVALUATE SPEED

CHROME USER EXPERIENCE REPORTS

It can be a quick performance win.
CDNs can make deployment ‘easy’.

HTTP/2 requires HTTPS*.
Likely to see last holds outs migrating to HTTPS.
(* in all major browsers)

Enable the ‘Protocol’ column.

SPDY was HTTP/2’s predecessor.
It is being retired.

Chrome Extension:
https://dis.tl/showhttp2

HTTP/1.1 and HTTP/2 exist together.
Browsers will fall back to HTTP/1.1.

Moving to HTTP/2 is
not a migration.

Googlebot won’t benefit,
but Google will notice.

HTTP/2 BrightonSEO 2018

Recomendados

Recomendados

Más contenido relacionado

La actualidad más candente

La actualidad más candente (20)

Similar a HTTP/2 BrightonSEO 2018

Similar a HTTP/2 BrightonSEO 2018 (20)

Más de Tom Anthony

Más de Tom Anthony (16)

Último

Último (20)

HTTP/2 BrightonSEO 2018