Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Know thy buzzwords: HTTP/2
Search
Surma
July 13, 2017
Technology
1
550
Know thy buzzwords: HTTP/2
Fullstack Conf 2017
Surma
July 13, 2017
Tweet
Share
More Decks by Surma
See All by Surma
Houdini Breakout Session
surma
4
650
Houdini – Demystifying CSS
surma
3
330
Progressive Web Apps – Mobile has natively come to the Web
surma
5
300
The Glorious Era of HTTP/2
surma
1
95
Instant Loading
surma
4
1.3k
HTTP/2 101
surma
5
500
What if there isn’t?
surma
0
85
What if there isn’t?
surma
2
180
The Web is a Contender
surma
0
140
Other Decks in Technology
See All in Technology
生成AI_その前_に_マルチクラウド時代の信頼できるデータを支えるSnowflakeメタデータ活用術.pdf
cm_mikami
0
120
リーダーになったら未来を語れるようになろう/Speak the Future
sanogemaru
0
300
AI時代だからこそ考える、僕らが本当につくりたいスクラムチーム / A Scrum Team we really want to create in this AI era
takaking22
7
3.7k
職種別ミートアップで社内から盛り上げる アウトプット文化の醸成と関係強化/ #DevRelKaigi
nishiuma
2
140
AWSにおけるTrend Vision Oneの効果について
shimak
0
130
「AI駆動PO」を考えてみる - 作る速さから価値のスループットへ:検査・適応で未来を開発 / AI-driven product owner. scrummat2025
yosuke_nagai
4
630
業務自動化プラットフォーム Google Agentspace に入門してみる #devio2025
maroon1st
0
200
about #74462 go/token#FileSet
tomtwinkle
1
430
Git in Team
kawaguti
PRO
2
110
Modernizing Virtio GPU: A Rust-Powered Approach with vhost-device-gpu
ennael
PRO
0
100
AI ReadyなData PlatformとしてのAutonomous Databaseアップデート
oracle4engineer
PRO
0
210
Large Vision Language Modelを用いた 文書画像データ化作業自動化の検証、運用 / shibuya_AI
sansan_randd
0
110
Featured
See All Featured
Site-Speed That Sticks
csswizardry
11
880
Connecting the Dots Between Site Speed, User Experience & Your Business [WebExpo 2025]
tammyeverts
9
580
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
soudai
PRO
189
55k
Java REST API Framework Comparison - PWX 2021
mraible
33
8.8k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
34
6.1k
How to train your dragon (web standard)
notwaldorf
96
6.3k
We Have a Design System, Now What?
morganepeng
53
7.8k
Designing for Performance
lara
610
69k
jQuery: Nuts, Bolts and Bling
dougneiner
64
7.9k
Measuring & Analyzing Core Web Vitals
bluesmoon
9
610
Typedesign – Prime Four
hannesfritz
42
2.8k
Why You Should Never Use an ORM
jnunemaker
PRO
59
9.6k
Transcript
@DasSurma Developer Advocate ✨HTTP/2✨ OMG so good
TL;DR: SWITCH!
HTTP/1.1 – Upgrade – HTTP/2.0 ✨HTTP/2✨
caniuse.com
None
History HTTP HTTP/0.9 HTTP/1.0 HTTP/1.1 SPDY/2 HTTP/2 1991 1996 1997
2012 2015
History HTTP HTTP/0.9 HTTP/1.0 HTTP/1.1 SPDY/2 HTTP/2 1991 1996 1997
2012 2015 bit.ly/surma-http2 Talk from CDS 2015
Head-of-Line Blocking aka one-resource-at-a-time syndrome
HTTP/1
HTTP/1
HTTP/1 200KB 4s
✨HTTP/2✨ Single TCP connection
http2.golang.org/gophertiles
h1 h2
Concatenation Inlining Bundling Spriting ? More later
Encryption
None
None
✨HTTP/2✨ TLS encrypted ? ?
✨HTTP/2✨ $0
certbot.eff.org
CDNs say bit.ly/surma-http2-performance-increase HTTP/2 is 20% faster (on avg)
h2 capable h2 enabled h2 unsupported 7,200 ms 5,325 ms
6,160 ms Time to mobile load event Sample is 1 month of data on https://next.ft.com 26%
HTTP/2 bit.ly/chromeblog-http2
But how? Setup? Testing? bit.ly/surma-http2-setup
What about local development?
None
None
What did I not talk about yet?
HPACK
HTTP/2 Push
RTT > Bandwidth
index.html styles.css webfont.css webfont.woff <link> @import @font-face 14K 1.4K 800B
12K Back-of-napkin math: Total data: 28.4K Data transfer time: 37ms # of RTTs: 4 Total time: 437ms
None
bit.ly/jake-push
bit.ly/jake-push TL;DR: – Massive inconsistencies between browsers – Not pushing
things that are already in the cache is a hard problem – Don’t even think about pushing anything but GET
bit.ly/jake-push Alternatives – Inlining for first-paint-critical resources – <link rel=“preload”>
for interactive-critical resources
Onemore thing about bundling bit.ly/sergio-bundling
TL;DR: SWITCH!
@DasSurma Developer Advocate ✨HTTP/2✨ OMG so good