Upgrade to Pro — share decks privately, control downloads, hide ads and more …

クラウドゲーミング時代のPWA

Avatar for oliver oliver
February 01, 2020
Technology
0
13k

 クラウドゲーミング時代のPWA

「PWA Night Conference 2020」のLTにて登壇した発表資料です。
https://conf2020.pwanight.jp/

Avatar for oliver

oliver

February 01, 2020
Tweet

More Decks by oliver

See All by oliver
comilioとCloudflare、そして未来へと向けて
Avatar for oliver oliver_diary
6
1k
Cacheable Presigned URL with Cloudflare Workers
Avatar for oliver oliver_diary
2
7.9k
テキストエディタのブラウザ実装 / tokyo_study
Avatar for oliver oliver_diary
0
320
迫り来る絶望的状況からの脱却物語 / #CEDEC2021
Avatar for oliver oliver_diary
7
16k
PWAとクラウドゲーミングの現状そしてPWAとOOParts
Avatar for oliver oliver_diary
3
12k
OOPartsによるPWA事例紹介
Avatar for oliver oliver_diary
2
10k
クラウドゲーミング最新開発事例 - #CEDEC2020
Avatar for oliver oliver_diary
6
17k
OOPartsが切り開く クラウドゲーミング ✖︎ PWA
Avatar for oliver oliver_diary
4
17k
今日から始めるFirestoreのテスト
Avatar for oliver oliver_diary
2
12k

Other Decks in Technology

See All in Technology
アジャイル社内普及ご近所さんマップを作ろう / Let's create an agile neighborhood map
Avatar for Satoshi Harada psj59129
1
130
[mercari GEARS 2025] なぜメルカリはノーコードを選ばなかったのか？ 社内問い合わせ工数を60％削減したLLM活用の裏側
Avatar for mercari mercari
PRO
0
120
Proxmox × HCP Terraformで始めるお家プライベートクラウド
Avatar for Lamaglama39 lamaglama39
1
210
Post-AIコーディング時代のエンジニア生存戦略
Avatar for shinoyu shinoyu
0
290
ABEMAのCM配信を支えるスケーラブルな分散カウンタの実装
Avatar for Honoka Toda hono0130
3
840
大規模モノレポの秩序管理 失速しない多言語化フロントエンドの運用 / JSConf JP 2025
Avatar for shoota shoota
0
190
やり方は一つだけじゃない、正解だけを目指さず寄り道やその先まで自分流に楽しむ趣味プログラミングの探求 2025-11-15 YAPC::Fukuoka
Avatar for すぎゃーん sugyan
2
820
第65回コンピュータビジョン勉強会
Avatar for TSUKAMOTO Kenji tsukamotokenji
0
150
re:Invent2025 事前勉強会 歴史と愉しみ方10分LT編
Avatar for T.Atsumi toshi_atsumi
0
140
マイクロリブート ~ACEマインドセットで実現するアジャイル~
Avatar for ソニー株式会社 sony
1
400
「O(n log(n))のパフォーマンス」の意味がわかるようになろう
Avatar for dhirabayashi dhirabayashi
0
190
バフェットコード株式会社 開発チームカルチャーデック
Avatar for Shu Suzuki shoe116
1
110

Featured

See All Featured
Gamification - CAS2011
Avatar for David Bonilla davidbonilla
81
5.5k
Put a Button on it: Removing Barriers to Going Fast.
Avatar for kastner kastner
60
4.1k
The Power of CSS Pseudo Elements
Avatar for Geoffrey Crofte geoffreycrofte
80
6.1k
ReactJS: Keep Simple. Everything can be a component!
Avatar for Pedro Nauck pedronauck
666
130k
Bash Introduction
Avatar for André Augusto Costa Santos 62gerente
615
210k
A better future with KSS
Avatar for Kyle Neath kneath
239
18k
The Pragmatic Product Professional
Avatar for Laura Van Doore lauravandoore
36
7k
Testing 201, or: Great Expectations
Avatar for Joseph Mastey jmmastey
46
7.8k
Context Engineering - Making Every Token Count
Avatar for Addy Osmani addyosmani
10
390
Why Our Code Smells
Avatar for Brandon Keepers bkeepers
PRO
340
57k
Art, The Web, and Tiny UX
Avatar for Lynn Fisher lynnandtonic
303
21k
Site-Speed That Sticks
Avatar for Harry Roberts csswizardry
13
960

Transcript

  1. @OOParts_JP / #OOPartsGame 1 Ϋϥ΢υήʔϛϯά࣌୅ͷPWA 2020.02.01 PWA Night Conference 


    @oliver_diary

  2. ࣗݾ঺հ

  3. @OOParts_JP / #OOPartsGame 3 օ઒ େथʢDaiki Minakawaʣ Twitter: @oliver_diary GitHub,

    Qiita: minakawa-daiki Client-Side Developer at Black Inc.

  4. OOPartsͱ͍͏ Ϋϥ΢υήʔϛϯάαʔϏεͷ঺հ

  5. @OOParts_JP / #OOPartsGame 5 • ඒগঁήʔϜʹಛԽͨ͠ɺΫϥ΢υήʔϛϯάϓϥοτϑΥʔϜ • WindowͷนΛ௒͑ɺεϚϗΛ͸͡Ίͱ͠ϒϥ΢β͑͋͞Ε͹ϓϨΠՄೳ • Webϒϥ΢β͔ΒΞϓϦͱͯ͠ΠϯετʔϧՄೳ

    • 2020೥2݄࣌఺ݱࡏɺΫϩʔζυϕʔλΛެ։த • ۙ೔ਖ਼ࣜϦϦʔε༧ఆ OOPartsͷ঺հ

  6. https://oo.parts/

  7. OOPartsͱPWAͷͱΓ͘Έ

  8. @OOParts_JP / #OOPartsGame 8 https://speakerdeck.com/oliver_diary/oopartsgaqie-rikai-ku-kuraudogemingu-pwa

  9. Webͷ͜Ε·Ͱ

  10. @OOParts_JP / #OOPartsGame 10 HTTPͷ࢓૊Έ ΫϥΠΞϯτ ᶃ ϦΫΤετ ᶄ Ϩεϙϯε

    αʔόʔ

  11. @OOParts_JP / #OOPartsGame 11 ಉظ௨৴͕ओྲྀͷαΠτ ΫϥΠΞϯτ ᶃ https://example.com
 ʹϦΫΤετ ᶄ

    Html, CSS, JavaScript ͳͲͷϑΝΠϧΛϨεϙϯε αʔόʔ 11

  12. @OOParts_JP / #OOPartsGame 12 ಉظ௨৴͕ओྲྀͷαΠτ ΫϥΠΞϯτ ᶅ https://example.com/next
 ͷϦϯΫΛΫϦοΫ ᶆ

    Html, CSS, JavaScript ͳͲͷϑΝΠϧΛϨεϙϯε αʔόʔ 12 ※Ұ୴Ωϟογϡ͸ແࢹ

  13. @OOParts_JP / #OOPartsGame 13 ϖʔδ୯ҐͰ ϦΫΤετͱϨεϙϯε͕׬݁͢Δ 13

  14. @OOParts_JP / #OOPartsGame 14 Ajaxͷొ৔ ΫϥΠΞϯτ σʔλΛඇಉظͰૹ৴ αʔόʔ ͜͜ΛΫϦοΫ FOO

    /

  15. @OOParts_JP / #OOPartsGame 15 Ajaxͷొ৔ ΫϥΠΞϯτ αʔόʔ ͜͜ΛΫϦοΫ BAR /

    Ϩεϙϯε ίϯςϯπ͸ มΘ͍ͬͯΔ 63-͸ มԽͳ͠

  16. @OOParts_JP / #OOPartsGame 16 ඇಉظͰαʔόʔͱ௨৴͠
 ཁૉΛߋ৽͍ͯ͘͠ 16

  17. @OOParts_JP / #OOPartsGame 17 Ajaxͷొ৔ ΫϥΠΞϯτ αʔόʔ OFYU΁Ҡಈ FOO /

    /next΁ͷϦϯΫΛΫϦοΫ

  18. @OOParts_JP / #OOPartsGame 18 Ajaxͷొ৔ ΫϥΠΞϯτ αʔόʔ Next /next ίϯςϯπ΋

    มΘ͍ͬͯΔ 63-͸ มԽ Html, CSS, JavaScript ͳͲͷϑΝΠϧΛϨεϙϯε ※Ұ୴Ωϟογϡ͸ແࢹ

  19. @OOParts_JP / #OOPartsGame 19 ϖʔδͷભҠʹؔͯ͠͸
 ಉظతͳભҠ͕ଟ͔ͬͨ ʢpjaxͱ͔ɺTurbolinksͱ͔͸ଘࡏ͕ͯͨ͠ɺ͜͜Ͱ͸লུʣ 19

  20. SPAͷొ৔

  21. @OOParts_JP / #OOPartsGame 21 SPAͷొ৔ ΫϥΠΞϯτ αʔόʔ OFYU΁Ҡಈ FOO /

    /next΁ͷϦϯΫΛΫϦοΫ

  22. @OOParts_JP / #OOPartsGame 22 SPAͷొ৔ ΫϥΠΞϯτ αʔόʔ Next /next ίϯςϯπ΋

    มΘ͍ͬͯΔ 63-͕ มԽ ඞཁͳσʔλ͚ͩϨεϙϯε

  23. @OOParts_JP / #OOPartsGame 23 ඇಉظతͳϖʔδભҠͷੈք
 ωΠςΟϒΞϓϦͷܗʹ͍ۙͮͨ 23

  24. ͦͯ͠ɺPWA

  25. @OOParts_JP / #OOPartsGame 25 SPAͷੈք؍ͱϚον
 ωΠςΟϒΞϓϦͷΑ͏ʹWebΞϓϦΛѻ͑Δ 25

  26. @OOParts_JP / #OOPartsGame ϒϥ΢βΛىಈ͢Δ URLΛೖྗ ଴ػ ଴ػ ଴ػ OOPartsΛىಈ͢Δ ωΠςΟϒΞϓϦ

    ͷΑ͏ʹىಈͰ͖Δ URLόʔ͕ଘࡏ͠ͳ͍ੈք PWAԽ

  27. ͦͯ͠ɺΫϥ΢υήʔϛϯάA

  28. @OOParts_JP / #OOPartsGame ඇಉظత ήʔϜͷϩʔσΟϯά

  29. @OOParts_JP / #OOPartsGame 29 ө૾ΛετϦʔϛϯά഑৴ ԋࢉॲཧ Ϣʔβ͔Βͷૢ࡞ ήʔϜϓϨΠத ඇಉظత

  30. @OOParts_JP / #OOPartsGame 30 ήʔϜͷੈք͸ɺඇಉظ͕ͨ͘͞Μ 30

  31. @OOParts_JP / #OOPartsGame 31 Ϋϥ΢υ্ͰɺήʔϜΛϓϨΠ͢Δٕज़͕௥͍͖ͭ ඇಉظతͳελΠϧ͕ओྲྀʹͳͬͨWebͱ
 PWAʹΑͬͯɺωΠςΟϒͱಉఔ౓ͷήʔϜମݧΛ Web্Ͱ΋ಘΒΕΔΑ͏ʹͳ͖͍ͬͯͯΔ 31

  32. @OOParts_JP / #OOPartsGame 32 32 ͦͯ͠ɺWebͷಛੑͰ΋͋Δ
 ৹͕ࠪଘࡏ͠ͳ͍ɺࣗ༝ͳੈք ϒϥ΢β͑͋͞Ε͹ɺͲ͔͜ΒͰ΋ΞΫηεͰ͖Δ ैདྷͷWebͷԸܙΛɺͦͷ··ڗडͰ͖Δ

  33. PWAʹΑΔมԽ

  34. @OOParts_JP / #OOPartsGame 34 34 ໿2.4ഒ ໿1ഒ ࠶๚໰͢ΔϢʔβʔ཰͕ଟ͍ʂ ໿8.1ਓʹ1ਓ Webܦ༝ʢඞͣ1ճ͸ܦ༝ʣ

    ਺஋ͷมԽ Google Analytics ΑΓ ूܭظؒ: 2019೥11݄22೔ ʙ 2020೥1݄31೔ ର৅ਓ਺: ΫϩʔζυϕʔλϢʔβʔ ໿3500ਓ ΞϓϦܦ༝ AndroidͱiOSͰϑΟϧλ

  35. @OOParts_JP / #OOPartsGame 35 35 ϢʔβʔͷมԽ PWAͷ՝୊ ஌ͬͯ΋Β͑Δͱେ޷ධ ී௨ʹ஌Βͳ͍ਓ΋ଟ͍

  36. ͓ΘΓʹ

  37. @OOParts_JP / #OOPartsGame 37 37 Ϋϥ΢υήʔϛϯά͸ ୺຤ͷεϖοΫͷนΛ௒͑ ୺຤ͷछྨͷนΛ௒͑ ମݧͷนΛ΋௒͑ ࠓޙɺΑΓ਎ۙͳ΋ͷͱͳΔͰ͠ΐ͏

  38. ͋Γ͕ͱ͏͍͟͝·ͨ͠