Pro Yearly is on sale from $80 to $50! »

HTTP/2 is here, now let's make it easy

HTTP/2 is here, now let's make it easy

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.

Presented at DotJS in Paris.

0177cdce6af15e10db15b6bf5dc4e0b0?s=128

Rebecca Murphey

December 07, 2015
Tweet

Transcript

  1. http/2 is here, let’s optimize now let’s make it easy

    Rebecca Murphey / DotJS 2015 / Paris
  2. 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
  3. Designed for the web that is, 
 not for the

    web that was.
  4. None
  5. None
  6. None
  7. None
  8. There’s a lot we still don’t know about how HTTP/2

    should work in the real world.
  9. How will servers support HTTP/2?

  10. 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
  11. link: </light_button.png>; 
 rel=preload</light_logo.png>; 
 rel=preload</poweredby.png>; 
 rel=preload</favicon.ico>; 
 rel=preload

  12. None
  13. How will servers support HTTP/2?

  14. How will we visualize HTTP/2 connections?

  15. <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>separate</title> </head> <body>

    <script> setTimeout(function () { var s = document.createElement('script'); s.src = "/common/libs/combined.js"; document.body.appendChild(s); }, 200); </script> <!--load a bunch of jquery’s--> </body> </html> /index.html?push=/common/libs/combined.js
  16. None
  17. push starts: 96ms all data sent: 366ms push accepted: 500ms

  18. None
  19. None
  20. $ npm install chrome-http2-log-parser

  21. How will we visualize HTTP/2 connections?

  22. How will my app work with HTTP/2?

  23. None
  24. grunt build:http2 grunt build:http1

  25. None
  26. How should my app work with HTTP/2?

  27. Why does all of this matter?

  28. 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.
  29. bit.ly/http2-make-it-easy @rmurphey