Slide 1

Slide 1 text

PWAೖ໳ߨ࠲ Part3 ʔ PWAͷجૅᶅ ʔ

Slide 2

Slide 2 text

໨࣍ ▹  PWAʹ͓͚ΔΩϟογϡͷλΠϛ ϯά ▹  Ωϟογϡઓུ ▹  ετϨʔδͷબ୒ 2

Slide 3

Slide 3 text

PWAʹ͓͚ΔΩϟογϡͷλΠϛϯά

Slide 4

Slide 4 text

Ωϟογϡͷ࢖༻λΠϛϯάʢ1ʣ 4 タイミング 動作・用途・キャッシュ対象 Install時 •  依存関係として静的アセット •  非依存関係として、すぐに必要ないサイズ が大きいリソース Activate時 •  不要なキャッシュの削除 •  IndexedDBのスキーマ移行 •  古いSWがActive時にやり残した処理 ユーザ操作時 •  「あとで読む」や「オフライン用に保存」ボタ ンクリック時のリソース取得 ネットワークの応答時 •  受信トレイや記事コンテンツなど、頻繁に更 新されるリソース •  キャッシュ内にリクエストに一致するものが あればキャッシュを使用

Slide 5

Slide 5 text

Ωϟογϡͷ࢖༻λΠϛϯάʢ2ʣ 5 タイミング 動作・用途・キャッシュ対象 プッシュメッセージ時 •  通知に関するコンテンツ(チャットメッセージ、 ニュース速報、メール) •  即座に同期する必要があるコンテンツ (ToDoリストのアップデートなど) バックグラウンド同 期時 •  ソーシャルメディアのタイムラインなど、急を 要さないアップデート

Slide 6

Slide 6 text

Ωϟογϡઓུ

Slide 7

Slide 7 text

Ωϟογϡઓུ 7 戦略 説明 キャッシュのみ •  静的アセット(install時キャッシュしたもの) ネットワークのみ •  GET以外のリクエストなど、オフラインに相当しな いもの キャッシュファースト (オフラインファースト) •  キャッシュになければネットワークから取得 キャッシュとネットワーク の競争 •  キャッシュ、ネットワークの双方を利用し、速い方を 採用 •  ディスクアクセスが低速な端末でのパフォーマンス 追求 ネットワークファースト •  頻繁に更新されるリソース •  ネットワーク低速時に待ちが発生 先にキャッシュ、次にネッ トワーク •  頻繁に更新されるリソース •  とりあえずキャッシュから取得し、ネットワークから 取得した時点で更新 •  閲覧中のコンテンツが更新されるとユーザの混乱 を招く

Slide 8

Slide 8 text

ετϨʔδͷબ୒

Slide 9

Slide 9 text

ετϨʔδͷબ୒ 9 タイプ 使用するもの ローカル key-valueストア •  Cache ローカル 構造化ストレージ •  IndexedDB グローバル バイトストリーム •  Cloud Storage ଟ͘ͷϒϥ΢βͰαϙʔτ͞Ε͍ͯΔ͜ͱɺඇಉظI/OͰ͋Δ͜ ͱ͕બఆͷج४ͱͳΔ

Slide 10

Slide 10 text

END