Slide 1

Slide 1 text

http/2 is here, let’s optimize now let’s make it easy Rebecca Murphey / DotJS 2015 / Paris

Slide 2

Slide 2 text

http/2 one connection 
 per host* handles 
 all requests server push 
 (no more inlining!) prioritization https required 
 by browsers * through connection coalescing, hosts that resolve to the same IP can share the same connection

Slide 3

Slide 3 text

Designed for the web that is, 
 not for the web that was.

Slide 4

Slide 4 text

No content

Slide 5

Slide 5 text

No content

Slide 6

Slide 6 text

No content

Slide 7

Slide 7 text

No content

Slide 8

Slide 8 text

There’s a lot we still don’t know about how HTTP/2 should work in the real world.

Slide 9

Slide 9 text

How will servers support HTTP/2?

Slide 10

Slide 10 text

How a web server determines what a 
 client needs before the client knows
 is seriously challenging, especially for 
 general-purpose web servers which need to allow site owners to tune certain aspects for best performance and reliability. The heuristics for determining what to push vary. https://caddyserver.com/blog/implementing-http2-isnt-trivial

Slide 11

Slide 11 text

link: ; 
 rel=preload; 
 rel=preload; 
 rel=preload; 
 rel=preload

Slide 12

Slide 12 text

No content

Slide 13

Slide 13 text

How will servers support HTTP/2?

Slide 14

Slide 14 text

How will we visualize HTTP/2 connections?

Slide 15

Slide 15 text

separate setTimeout(function () { var s = document.createElement('script'); s.src = "/common/libs/combined.js"; document.body.appendChild(s); }, 200); /index.html?push=/common/libs/combined.js

Slide 16

Slide 16 text

No content

Slide 17

Slide 17 text

push starts: 96ms all data sent: 366ms push accepted: 500ms

Slide 18

Slide 18 text

No content

Slide 19

Slide 19 text

No content

Slide 20

Slide 20 text

$ npm install chrome-http2-log-parser

Slide 21

Slide 21 text

How will we visualize HTTP/2 connections?

Slide 22

Slide 22 text

How will my app work with HTTP/2?

Slide 23

Slide 23 text

No content

Slide 24

Slide 24 text

grunt build:http2 grunt build:http1

Slide 25

Slide 25 text

No content

Slide 26

Slide 26 text

How should my app work with HTTP/2?

Slide 27

Slide 27 text

Why does all of this matter?

Slide 28

Slide 28 text

Members of the front-end community are among the most likely to champion HTTP/2. The spec may be finalized, but HTTP/2 is incomplete without a developer ecosystem to support it.

Slide 29

Slide 29 text

bit.ly/http2-make-it-easy @rmurphey