Enviar pesquisa
Carregar
HTTP2入門
•
9 gostaram
•
1,087 visualizações
Sota Sugiura
Seguir
HTTP2 入門
Leia menos
Leia mais
Tecnologia
Denunciar
Compartilhar
Denunciar
Compartilhar
1 de 63
Baixar agora
Baixar para ler offline
Recomendados
HTTP入門
HTTP入門
Sota Sugiura
HTTP/2, QUIC入門
HTTP/2, QUIC入門
shigeki_ohtsu
HTTP入門
HTTP入門
Sho A
新人Git/Github研修公開用スライド(その2)
新人Git/Github研修公開用スライド(その2)
pupupopo88
HTTP/2の現状とこれから
HTTP/2の現状とこれから
shigeki_ohtsu
新人Git/Github研修公開用スライド(その1)
新人Git/Github研修公開用スライド(その1)
pupupopo88
SlideShareをやめて Speaker Deckに移行します
SlideShareをやめて Speaker Deckに移行します
Moriwaka Kazuo
Raspberry Pi + Go で IoT した話
Raspberry Pi + Go で IoT した話
yaegashi
Recomendados
HTTP入門
HTTP入門
Sota Sugiura
HTTP/2, QUIC入門
HTTP/2, QUIC入門
shigeki_ohtsu
HTTP入門
HTTP入門
Sho A
新人Git/Github研修公開用スライド(その2)
新人Git/Github研修公開用スライド(その2)
pupupopo88
HTTP/2の現状とこれから
HTTP/2の現状とこれから
shigeki_ohtsu
新人Git/Github研修公開用スライド(その1)
新人Git/Github研修公開用スライド(その1)
pupupopo88
SlideShareをやめて Speaker Deckに移行します
SlideShareをやめて Speaker Deckに移行します
Moriwaka Kazuo
Raspberry Pi + Go で IoT した話
Raspberry Pi + Go で IoT した話
yaegashi
ruby-ffiについてざっくり解説
ruby-ffiについてざっくり解説
ota42y
ChatGPTのデータソースにPostgreSQLを使う(第42回PostgreSQLアンカンファレンス@オンライン 発表資料)
ChatGPTのデータソースにPostgreSQLを使う(第42回PostgreSQLアンカンファレンス@オンライン 発表資料)
NTT DATA Technology & Innovation
WebSocket / WebRTCの技術紹介
WebSocket / WebRTCの技術紹介
Yasuhiro Mawarimichi
コンセプトから理解するGitコマンド
コンセプトから理解するGitコマンド
ktateish
分散システムの限界について知ろう
分散システムの限界について知ろう
Shingo Omura
家庭で使うSlack
家庭で使うSlack
Mitsushige Ishiguro
もうひとつのアンチパターン OTLT、あるいは如何にして私はオレオレフレームワークを忌み嫌うようになったか
もうひとつのアンチパターン OTLT、あるいは如何にして私はオレオレフレームワークを忌み嫌うようになったか
suno88
dm-writeboost-kernelvm
dm-writeboost-kernelvm
Akira Hayakawa
chatGPTの驚くべき対話能力.pdf
chatGPTの驚くべき対話能力.pdf
YamashitaKatsushi
目grep入門 +解説
目grep入門 +解説
murachue
pgvectorを使ってChatGPTとPostgreSQLを連携してみよう!(PostgreSQL Conference Japan 2023 発表資料)
pgvectorを使ってChatGPTとPostgreSQLを連携してみよう!(PostgreSQL Conference Japan 2023 発表資料)
NTT DATA Technology & Innovation
ChatGPT は高階層の意味理解にはほど遠い?
ChatGPT は高階層の意味理解にはほど遠い?
Hide Koba
Rust で RTOS を考える
Rust で RTOS を考える
ryuz88
Skywayのビデオチャットを録画しよう。そう、ブラウザでね
Skywayのビデオチャットを録画しよう。そう、ブラウザでね
mganeko
Pythonでキャッシュを活用する話①
Pythonでキャッシュを活用する話①
iPride Co., Ltd.
TLS, HTTP/2演習
TLS, HTTP/2演習
shigeki_ohtsu
ネットワーク ゲームにおけるTCPとUDPの使い分け
ネットワーク ゲームにおけるTCPとUDPの使い分け
モノビット エンジン
Zabbixで学ぶ統計解析入門
Zabbixで学ぶ統計解析入門
Takeo Noda
VirtualBox と Rocky Linux 8 で始める Pacemaker ~ VirtualBox でも STONITH 機能が試せる! Vi...
VirtualBox と Rocky Linux 8 で始める Pacemaker ~ VirtualBox でも STONITH 機能が試せる! Vi...
ksk_ha
Kubernetes ネットワーキングのすべて
Kubernetes ネットワーキングのすべて
LINE Corporation
「データベース実践入門」から学ぶリレーショナルモデル
「データベース実践入門」から学ぶリレーショナルモデル
Sota Sugiura
最新プロトコル HTT/2 とは
最新プロトコル HTT/2 とは
Yukimitsu Izawa
Mais conteúdo relacionado
Mais procurados
ruby-ffiについてざっくり解説
ruby-ffiについてざっくり解説
ota42y
ChatGPTのデータソースにPostgreSQLを使う(第42回PostgreSQLアンカンファレンス@オンライン 発表資料)
ChatGPTのデータソースにPostgreSQLを使う(第42回PostgreSQLアンカンファレンス@オンライン 発表資料)
NTT DATA Technology & Innovation
WebSocket / WebRTCの技術紹介
WebSocket / WebRTCの技術紹介
Yasuhiro Mawarimichi
コンセプトから理解するGitコマンド
コンセプトから理解するGitコマンド
ktateish
分散システムの限界について知ろう
分散システムの限界について知ろう
Shingo Omura
家庭で使うSlack
家庭で使うSlack
Mitsushige Ishiguro
もうひとつのアンチパターン OTLT、あるいは如何にして私はオレオレフレームワークを忌み嫌うようになったか
もうひとつのアンチパターン OTLT、あるいは如何にして私はオレオレフレームワークを忌み嫌うようになったか
suno88
dm-writeboost-kernelvm
dm-writeboost-kernelvm
Akira Hayakawa
chatGPTの驚くべき対話能力.pdf
chatGPTの驚くべき対話能力.pdf
YamashitaKatsushi
目grep入門 +解説
目grep入門 +解説
murachue
pgvectorを使ってChatGPTとPostgreSQLを連携してみよう!(PostgreSQL Conference Japan 2023 発表資料)
pgvectorを使ってChatGPTとPostgreSQLを連携してみよう!(PostgreSQL Conference Japan 2023 発表資料)
NTT DATA Technology & Innovation
ChatGPT は高階層の意味理解にはほど遠い?
ChatGPT は高階層の意味理解にはほど遠い?
Hide Koba
Rust で RTOS を考える
Rust で RTOS を考える
ryuz88
Skywayのビデオチャットを録画しよう。そう、ブラウザでね
Skywayのビデオチャットを録画しよう。そう、ブラウザでね
mganeko
Pythonでキャッシュを活用する話①
Pythonでキャッシュを活用する話①
iPride Co., Ltd.
TLS, HTTP/2演習
TLS, HTTP/2演習
shigeki_ohtsu
ネットワーク ゲームにおけるTCPとUDPの使い分け
ネットワーク ゲームにおけるTCPとUDPの使い分け
モノビット エンジン
Zabbixで学ぶ統計解析入門
Zabbixで学ぶ統計解析入門
Takeo Noda
VirtualBox と Rocky Linux 8 で始める Pacemaker ~ VirtualBox でも STONITH 機能が試せる! Vi...
VirtualBox と Rocky Linux 8 で始める Pacemaker ~ VirtualBox でも STONITH 機能が試せる! Vi...
ksk_ha
Kubernetes ネットワーキングのすべて
Kubernetes ネットワーキングのすべて
LINE Corporation
Mais procurados
(20)
ruby-ffiについてざっくり解説
ruby-ffiについてざっくり解説
ChatGPTのデータソースにPostgreSQLを使う(第42回PostgreSQLアンカンファレンス@オンライン 発表資料)
ChatGPTのデータソースにPostgreSQLを使う(第42回PostgreSQLアンカンファレンス@オンライン 発表資料)
WebSocket / WebRTCの技術紹介
WebSocket / WebRTCの技術紹介
コンセプトから理解するGitコマンド
コンセプトから理解するGitコマンド
分散システムの限界について知ろう
分散システムの限界について知ろう
家庭で使うSlack
家庭で使うSlack
もうひとつのアンチパターン OTLT、あるいは如何にして私はオレオレフレームワークを忌み嫌うようになったか
もうひとつのアンチパターン OTLT、あるいは如何にして私はオレオレフレームワークを忌み嫌うようになったか
dm-writeboost-kernelvm
dm-writeboost-kernelvm
chatGPTの驚くべき対話能力.pdf
chatGPTの驚くべき対話能力.pdf
目grep入門 +解説
目grep入門 +解説
pgvectorを使ってChatGPTとPostgreSQLを連携してみよう!(PostgreSQL Conference Japan 2023 発表資料)
pgvectorを使ってChatGPTとPostgreSQLを連携してみよう!(PostgreSQL Conference Japan 2023 発表資料)
ChatGPT は高階層の意味理解にはほど遠い?
ChatGPT は高階層の意味理解にはほど遠い?
Rust で RTOS を考える
Rust で RTOS を考える
Skywayのビデオチャットを録画しよう。そう、ブラウザでね
Skywayのビデオチャットを録画しよう。そう、ブラウザでね
Pythonでキャッシュを活用する話①
Pythonでキャッシュを活用する話①
TLS, HTTP/2演習
TLS, HTTP/2演習
ネットワーク ゲームにおけるTCPとUDPの使い分け
ネットワーク ゲームにおけるTCPとUDPの使い分け
Zabbixで学ぶ統計解析入門
Zabbixで学ぶ統計解析入門
VirtualBox と Rocky Linux 8 で始める Pacemaker ~ VirtualBox でも STONITH 機能が試せる! Vi...
VirtualBox と Rocky Linux 8 で始める Pacemaker ~ VirtualBox でも STONITH 機能が試せる! Vi...
Kubernetes ネットワーキングのすべて
Kubernetes ネットワーキングのすべて
Destaque
「データベース実践入門」から学ぶリレーショナルモデル
「データベース実践入門」から学ぶリレーショナルモデル
Sota Sugiura
最新プロトコル HTT/2 とは
最新プロトコル HTT/2 とは
Yukimitsu Izawa
Http2入門の入門
Http2入門の入門
Net Kanayan
Web Audio API 入門
Web Audio API 入門
Sota Sugiura
Web Audio APIの初歩
Web Audio APIの初歩
Shota Kubota
HTTP/2入門
HTTP/2入門
渉 米須
HTTP/2 入門
HTTP/2 入門
Yahoo!デベロッパーネットワーク
TensorFlow を使った機械学習ことはじめ (GDG京都 機械学習勉強会)
TensorFlow を使った機械学習ことはじめ (GDG京都 機械学習勉強会)
徹 上野山
Destaque
(8)
「データベース実践入門」から学ぶリレーショナルモデル
「データベース実践入門」から学ぶリレーショナルモデル
最新プロトコル HTT/2 とは
最新プロトコル HTT/2 とは
Http2入門の入門
Http2入門の入門
Web Audio API 入門
Web Audio API 入門
Web Audio APIの初歩
Web Audio APIの初歩
HTTP/2入門
HTTP/2入門
HTTP/2 入門
HTTP/2 入門
TensorFlow を使った機械学習ことはじめ (GDG京都 機械学習勉強会)
TensorFlow を使った機械学習ことはじめ (GDG京都 機械学習勉強会)
Semelhante a HTTP2入門
Janogia20120921 yoshinotakeshi
Janogia20120921 yoshinotakeshi
Keisuke Ishibashi
HTTP/2 でリバプロするだけでグラフツールを 高速化できた話
HTTP/2 でリバプロするだけでグラフツールを 高速化できた話
Naotoshi Seo
WebSocket Protocol と Plack::Middleware::WebSocket
WebSocket Protocol と Plack::Middleware::WebSocket
Yu Nobuoka
HTTPとサーバ技術の最新動向
HTTPとサーバ技術の最新動向
Kazuho Oku
HTTP/2.0と標準化
HTTP/2.0と標準化
Taketo Takashima
IETF89 HTTP関連WG報告 #isocjp
IETF89 HTTP関連WG報告 #isocjp
Kaoru Maeda
CDNの仕組み(JANOG36)
CDNの仕組み(JANOG36)
J-Stream Inc.
H2O - making HTTP better
H2O - making HTTP better
Kazuho Oku
[BurpSuiteJapan]HTTP基礎入門
[BurpSuiteJapan]HTTP基礎入門
Burp Suite Japan User Group
Node の HTTP/2.0 モジュール iij-http2 の実装苦労話
Node の HTTP/2.0 モジュール iij-http2 の実装苦労話
shigeki_ohtsu
WebRTC SFU mediasoup sample
WebRTC SFU mediasoup sample
mganeko
HTTP/2時代のウェブサイト設計
HTTP/2時代のウェブサイト設計
Kazuho Oku
ストリーミングのげんざい
ストリーミングのげんざい
Tetsuya Morimoto
ネットワーク第3回目
ネットワーク第3回目
Yukiko Kato
20120525 mt websocket
20120525 mt websocket
Ryosuke MATSUMOTO
httpbis interim とhttp2.0相互接続試験の話
httpbis interim とhttp2.0相互接続試験の話
shigeki_ohtsu
Perl で作るメディアストリーミングサーバー
Perl で作るメディアストリーミングサーバー
Hideo Kimura
HTTPを理解する
HTTPを理解する
IIJ
HTML5 VIDEO on Chromecast
HTML5 VIDEO on Chromecast
Katsumi Onishi
Web基礎
Web基礎
stx_kata
Semelhante a HTTP2入門
(20)
Janogia20120921 yoshinotakeshi
Janogia20120921 yoshinotakeshi
HTTP/2 でリバプロするだけでグラフツールを 高速化できた話
HTTP/2 でリバプロするだけでグラフツールを 高速化できた話
WebSocket Protocol と Plack::Middleware::WebSocket
WebSocket Protocol と Plack::Middleware::WebSocket
HTTPとサーバ技術の最新動向
HTTPとサーバ技術の最新動向
HTTP/2.0と標準化
HTTP/2.0と標準化
IETF89 HTTP関連WG報告 #isocjp
IETF89 HTTP関連WG報告 #isocjp
CDNの仕組み(JANOG36)
CDNの仕組み(JANOG36)
H2O - making HTTP better
H2O - making HTTP better
[BurpSuiteJapan]HTTP基礎入門
[BurpSuiteJapan]HTTP基礎入門
Node の HTTP/2.0 モジュール iij-http2 の実装苦労話
Node の HTTP/2.0 モジュール iij-http2 の実装苦労話
WebRTC SFU mediasoup sample
WebRTC SFU mediasoup sample
HTTP/2時代のウェブサイト設計
HTTP/2時代のウェブサイト設計
ストリーミングのげんざい
ストリーミングのげんざい
ネットワーク第3回目
ネットワーク第3回目
20120525 mt websocket
20120525 mt websocket
httpbis interim とhttp2.0相互接続試験の話
httpbis interim とhttp2.0相互接続試験の話
Perl で作るメディアストリーミングサーバー
Perl で作るメディアストリーミングサーバー
HTTPを理解する
HTTPを理解する
HTML5 VIDEO on Chromecast
HTML5 VIDEO on Chromecast
Web基礎
Web基礎
Mais de Sota Sugiura
TechCrunchTokyo Hackathon 2015
TechCrunchTokyo Hackathon 2015
Sota Sugiura
コミットメッセージの話
コミットメッセージの話
Sota Sugiura
今さら聞けないXSS
今さら聞けないXSS
Sota Sugiura
各ブラウザでの均等割り付け比較
各ブラウザでの均等割り付け比較
Sota Sugiura
GitHubにおける開発フローについてのお話
GitHubにおける開発フローについてのお話
Sota Sugiura
Promiseでコールバック地獄から解放された話
Promiseでコールバック地獄から解放された話
Sota Sugiura
Mais de Sota Sugiura
(6)
TechCrunchTokyo Hackathon 2015
TechCrunchTokyo Hackathon 2015
コミットメッセージの話
コミットメッセージの話
今さら聞けないXSS
今さら聞けないXSS
各ブラウザでの均等割り付け比較
各ブラウザでの均等割り付け比較
GitHubにおける開発フローについてのお話
GitHubにおける開発フローについてのお話
Promiseでコールバック地獄から解放された話
Promiseでコールバック地獄から解放された話
HTTP2入門
1.
HTTP2 入門 杉浦 颯太
2.
アジェンダ • HTTPのおさらい • About
HTTP/2 - フレーム通信 - バイナリ - 通信の多重化 - サーバプッシュ • HTTP/2で変えるべきこと • 参考資料
3.
HTTPのおさらい
4.
HTTPで掴むべきポイントを 復習しましょう
5.
HTTPはWebのための技術 • HTTPはWeb上で 文書
をやり取りするために生まれた • 文書 とは主にHTMLのこと • HTMLとHTTPは兄弟 • この当時の 文書 にWebアプリケーションは含まれない
6.
Webを支えるHTTP • Webのトラフィックはほぼ全てHTTP通信 - ブラウザからサイトにアクセス -
APIを叩いてデータを取得(JSON, XML, SOAP) - 掲示板にコメントを投稿
7.
HTTP on TCP/IP •
HTTPはTCP/IPの上に成り立つプロトコル • サーバとクライアントが会話するための取り決め • 通信相手の特定はIP、データ配達はTCPの役割 - HTTPは相手がどこにいる誰かを意識しない
8.
HTTPの実態はテキストデータ GET /top/login HTTP/1.1 User-Agent:
Telnet [ja] Host: sota1235.com name=sota&hobby=aiko HTTP/1.1 200 OK Date: Tue, 10 Jul 2015 06:50:15 GMT Content-Length: 362 Content-Type: text:html <html> ……… HTTPリクエスト HTTPレスポンス
9.
HTTP is Simple •
HTTPはプロトコル • プロトコルとはメッセージのルール • ルールに従うパーサーを書けばHTTPサーバ/クライアントの出来上がり - 自前で実装したりすると勉強になります • クライアントは リクエスト を送る • サーバは レスポンス を返す
10.
HTTP is Stateless •
HTTPはステートレスなプロトコル • クライアント、サーバは通信内容を覚えない • 覚えさせたきゃ 🍪を使おう
11.
More… SlideShare: HTTP入門 https://www.slideshare.net/sotasugiura/http-51090035
12.
About HTTP/2
13.
HTTP/1.xから変わらないこと • HTTP on
TCP/IP • 通信はクライアントのリクエストから始まる
14.
HTTP/2で変わること • 通信単位がHTTPメッセージからフレームに • メッセージをバイナリに圧縮可能 •
一部でステートフルな通信を行う • 多重通信が可能に
15.
About HTTP/2 • フレーム通信 •
通信の多重化 • バイナリメッセージ • サーバプッシュ • 優先度制御
16.
About HTTP/2 • フレーム通信 •
通信の多重化 • バイナリメッセージ • サーバプッシュ • 優先度制御
17.
フレーム通信① • HTTP/2での通信単位はフレーム • 何種類かのフレームとやり取りして通信を行う •
フレームにはストリームIDが割り当てられる
18.
フレーム通信② • HEADERフレーム - HTTP/1.xのヘッダー部分 •
DATAフレーム - HTTP/1.xのボディ部分 • PRIORITYフレーム - 優先度制御を行う • PUSH_PROMISEフレーム - サーバプッシュ制御 • RST_STREAMフレーム - ストリーム通信の終了を知らせる
19.
例:HEADERフレーム フレーム通信③ :method = GET :scheme
= https :path = /resource host = example.org accept = image/jpg
20.
About HTTP/2 • フレーム通信 •
通信の多重化 • バイナリメッセージ • サーバプッシュ • 優先度制御
21.
通信の多重化 • HTTP/1.xでの通信は1リクエストに1レスポンス • レスポンスが返るまで次のリクエストは飛ばせない •
1つのTCP通信に1つのHTTP通信 • 多くのブラウザは6つのTCP通信を並列することで 擬似的にHTTP通信を多重化している
22.
on HTTP/1.xクライアント サーバ HTTPリクエスト HTTPレスポンス
23.
on HTTP/1.xクライアント サーバ HTTPリクエスト HTTPレスポンス HTTPリクエストその2
24.
HTTP/1.xの多重化
25.
HTTP/1.xの多重化 並列でリクエストしてる
26.
HTTP/1.xの多重化 • HTTP/1.xに並列通信の仕組みはない - 厳密にはあるが存在が空気 •
6本のTCP通信を並列することで擬似的に並列通信 している • どうあがいても1RTT = 6リクエスト/レスポンス
27.
それ、並列化しようぜ!
28.
on HTTP/2クライアント サーバ
29.
HTTP/2の場合 • レスポンスを任意のタイミングで返すことができる - これにより細やかな順序制御が可能に! •
クライアントはレスポンスを待たずにフレームを送 信できる • どれがどれに対応するかはストリームIDで確認
30.
参考 https://www.symfony.fi/entry/compare- resource-loading-between-http-2-and-http-1-1
31.
About HTTP/2 • フレーム通信 •
通信の多重化 • バイナリメッセージ • サーバプッシュ • 優先度制御
32.
バイナリメッセージ • HTTP/2の通信はバイナリで行うことが可能です
33.
バイナリの恩恵 • 実装による解釈の差が出にくい - HTTP/1.xでは実装によってメッセージの解釈に差が出ていた -
そこから脆弱性が発生することもしばしば - 有名どころだとBREACH攻撃とか - 参考:めんどうくさいWebセキュリティ • 通信量が減る - HTTP/1.xではgzip圧縮がデファクト
34.
オーバーヘッド削減 • HTTP/1.xでのメッセージにはオーバーヘッドが あった • これがバイナリとHPACKで圧縮することが可能に なった
35.
HTTP/1.xの無駄 例:画像を3枚取得する
36.
HTTP/1.xの無駄 /a.pngを取得 GET /a.png HTTP/1.1 Accept:
image/gif, image/jpeg, */* Accept-Language: ja Accept-Encoding: gzip, deflate User-Agent: Mozilla/4.0 (Compatible; MSIE 6.0; Windows NT 5.1;) Host: www.xxx.zzz Connection: Keep-Alive
37.
HTTP/1.xの無駄 /b.pngを取得 GET /b.png HTTP/1.1 Accept:
image/gif, image/jpeg, */* Accept-Language: ja Accept-Encoding: gzip, deflate User-Agent: Mozilla/4.0 (Compatible; MSIE 6.0; Windows NT 5.1;) Host: www.xxx.zzz Connection: Keep-Alive
38.
HTTP/1.xの無駄 /c.pngを取得 GET /c.png HTTP/1.1 Accept:
image/gif, image/jpeg, */* Accept-Language: ja Accept-Encoding: gzip, deflate User-Agent: Mozilla/4.0 (Compatible; MSIE 6.0; Windows NT 5.1;) Host: www.xxx.zzz Connection: Keep-Alive
39.
HTTP/1.xの無駄 /c.pngを取得 GET /c.png HTTP/1.1 Accept:
image/gif, image/jpeg, */* Accept-Language: ja Accept-Encoding: gzip, deflate User-Agent: Mozilla/4.0 (Compatible; MSIE 6.0; Windows NT 5.1;) Host: www.xxx.zzz Connection: Keep-Alive
40.
HTTP/1.xにおけるオーバーヘッド • 同じヘッダーを通信の回数だけやりとりする • 前回と差異のある情報は少ないことが多い •
『このヘッダーはさっきと同じだよ!』と知らせる ことができれば無駄が減るはず…
41.
バイナリメッセージ on HTTP/2 •
HTTP/2では通信をバイナリで行うことが可能 • 使用頻度の高いヘッダーフィールドはあらかじめ番 号が定義されている - 例: :method GET => 2 • 一度送信したものもその場で動的に番号を割り当て、 定義する
42.
/ にアクセス HTTP/2の場合 :method =
GET :scheme = https :path = / host = example.org accept = image/jpg 02 07 04 38 example.org 19 image/jpg
43.
/a.png にアクセス HTTP/2の場合 :method =
GET :scheme = https :path = /a.png host = example.org accept = image/jpg 02 07 04 a.png 62 63
44.
通信量減った\(^o^)/ • これにより最大5%まで圧縮が可能になった • HTTP/2通信開始時に送るSETTINGフレームで記憶する ヘッダーの数を指定できる -
一部ステートフル • 圧縮にはハフマンコーディングという技術が使われている - [検索] [ HPACK ]
45.
About HTTP/2 • フレーム通信 •
通信の多重化 • バイナリメッセージ • サーバプッシュ • 優先度制御
46.
サーバプッシュ • サーバがレスポンスを返す際、予測できるリクエス トが存在する • それらをあらかじめ送ることを予測してリクエスト を待たずに送信するのがサーバプッシュ
47.
サーバプッシュクライアント サーバ /index.htmlください あいよ
48.
サーバプッシュクライアント サーバ /index.htmlください あいよ style.cssとscript.jsもいるよね?この後送るわ
49.
サーバプッシュクライアント サーバ /index.htmlください あいよ style.cssとscript.jsもいるよね?この後送るわ リクエストを待たずに送信!
50.
サーバプッシュ • これにより通信回数が減る • きちんと送信されたかどうかの担保はHTTP/2の仕 組みがきちんと管理してくれる
51.
About HTTP/2 • フレーム通信 •
通信の多重化 • バイナリメッセージ • サーバプッシュ • 優先度制御
52.
優先度制御 • ユーザにWebページを届ける時、一番大事なのは ページが表示されるまでの時間 • それを縮めるための技術が優先度制御
53.
優先度制御 • HTTP/2対応サーバはクライアントが指定した優先 度に従ってレスポンスを返す • これにより描画に必要なCSSファイルを優先して取 得等の処理が可能になった •
優先度の指定の仕方はクライアントにより異なる
54.
優先度制御 • 優先度制御の指定方法は主に以下の2つ - リソース同士が依存した木構造 -
数字による重み付け • 現状、有効な優先度制御を行うブラウザはFireFox のみ
55.
HTTP/2で変えるべきこと
56.
HTTP/1.xは古い • HTTP/1.xは激しく変わるこの時代に対してとても古い 技術 - 策定されたのはなんと18年前 •
増えるリソース量、求められるレスポンスの速さを実現 するにはHTTP/1.xの技術だけでは限界があった
57.
Hack HTTP/1.x • 限界突破するために実に様々なHACKが行われてきた -
asset pipelines - Domain Sharding - CSS Sprite • これらはHTTP/2の登場によりオワコンになります (^q^)
58.
asset pipelines/CSS Sprite •
多重通信&優先度制御が可能になったので引退 • 理由 - 不要なデータがくっついている - ファイルの一部を変更すると全て再転送しなくてはいけない
59.
Domain Sharding • ブラウザでは1ドメインにつき6本のTCP通信を張る •
リソースを違うドメインでばらけさせることで6本の壁 を越える技術
60.
Domain Sharding • HTTP/2はTCPをまたぐことができない •
ドメインがバラけると優先度制御や多重通信の恩恵を受 けられない - 結果、遅くなる • CDNサーバを利用する場合、CDN経由でアプリケー ションにアクセスできるようにしましょう
61.
参考資料
62.
参考資料 • HTTP/2時代のウェブサイト設計 https://www.slideshare.net/kazuho/http2-51888328 • HTTP/2
Draft 16 日本語訳 http://blog.summerwind.jp/archives/2548
63.
あわせて知りたい • SPDY • QUIC •
HTTP/1.x • h2o
Baixar agora