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
クラウドゲーミング時代のPWA
Search
oliver
February 01, 2020
Technology
0
11k
クラウドゲーミング時代のPWA
「PWA Night Conference 2020」のLTにて登壇した発表資料です。
https://conf2020.pwanight.jp/
oliver
February 01, 2020
Tweet
Share
More Decks by oliver
See All by oliver
Cacheable Presigned URL with Cloudflare Workers
oliver_diary
2
5.8k
テキストエディタのブラウザ実装 / tokyo_study
oliver_diary
0
250
迫り来る絶望的状況からの脱却物語 / #CEDEC2021
oliver_diary
7
15k
PWAとクラウドゲーミングの現状そしてPWAとOOParts
oliver_diary
3
11k
OOPartsによるPWA事例紹介
oliver_diary
2
8.7k
クラウドゲーミング最新開発事例 - #CEDEC2020
oliver_diary
6
16k
OOPartsが切り開く クラウドゲーミング ✖︎ PWA
oliver_diary
4
15k
今日から始めるFirestoreのテスト
oliver_diary
2
10k
やっていこう。PWA
oliver_diary
13
16k
Other Decks in Technology
See All in Technology
OCI Security サービス 概要
oracle4engineer
PRO
0
6.5k
VideoMamba: State Space Model for Efficient Video Understanding
chou500
0
190
SRE×AIOpsを始めよう!GuardDutyによるお手軽脅威検出
amixedcolor
0
170
rootlessコンテナのすゝめ - 研究室サーバーでもできる安全なコンテナ管理
kitsuya0828
3
390
EventHub Startup CTO of the year 2024 ピッチ資料
eventhub
0
120
組織成長を加速させるオンボーディングの取り組み
sudoakiy
2
210
Incident Response Practices: Waroom's Features and Future Challenges
rrreeeyyy
0
160
マルチモーダル / AI Agent / LLMOps 3つの技術トレンドで理解するLLMの今後の展望
hirosatogamo
37
12k
マルチプロダクトな開発組織で 「開発生産性」に向き合うために試みたこと / Improving Multi-Product Dev Productivity
sugamasao
1
310
Python(PYNQ)がテーマのAMD主催のFPGAコンテストに参加してきた
iotengineer22
0
500
強いチームと開発生産性
onk
PRO
35
11k
CysharpのOSS群から見るModern C#の現在地
neuecc
2
3.5k
Featured
See All Featured
jQuery: Nuts, Bolts and Bling
dougneiner
61
7.5k
Put a Button on it: Removing Barriers to Going Fast.
kastner
59
3.5k
Fontdeck: Realign not Redesign
paulrobertlloyd
82
5.2k
The Myth of the Modular Monolith - Day 2 Keynote - Rails World 2024
eileencodes
16
2.1k
Performance Is Good for Brains [We Love Speed 2024]
tammyeverts
6
420
Typedesign – Prime Four
hannesfritz
40
2.4k
Faster Mobile Websites
deanohume
305
30k
I Don’t Have Time: Getting Over the Fear to Launch Your Podcast
jcasabona
28
2k
Designing Dashboards & Data Visualisations in Web Apps
destraynor
229
52k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
25
1.8k
Unsuck your backbone
ammeep
668
57k
Happy Clients
brianwarren
98
6.7k
Transcript
@OOParts_JP / #OOPartsGame 1 Ϋϥυήʔϛϯά࣌ͷPWA 2020.02.01 PWA Night Conference
@oliver_diary
ࣗݾհ
@OOParts_JP / #OOPartsGame 3 օ େथʢDaiki Minakawaʣ Twitter: @oliver_diary GitHub,
Qiita: minakawa-daiki Client-Side Developer at Black Inc.
OOPartsͱ͍͏ ΫϥυήʔϛϯάαʔϏεͷհ
@OOParts_JP / #OOPartsGame 5 • ඒগঁήʔϜʹಛԽͨ͠ɺΫϥυήʔϛϯάϓϥοτϑΥʔϜ • WindowͷนΛ͑ɺεϚϗΛ͡Ίͱ͠ϒϥβ͑͋͞ΕϓϨΠՄೳ • Webϒϥβ͔ΒΞϓϦͱͯ͠ΠϯετʔϧՄೳ
• 20202݄࣌ݱࡏɺΫϩʔζυϕʔλΛެ։த • ۙਖ਼ࣜϦϦʔε༧ఆ OOPartsͷհ
https://oo.parts/
OOPartsͱPWAͷͱΓ͘Έ
@OOParts_JP / #OOPartsGame 8 https://speakerdeck.com/oliver_diary/oopartsgaqie-rikai-ku-kuraudogemingu-pwa
Webͷ͜Ε·Ͱ
@OOParts_JP / #OOPartsGame 10 HTTPͷΈ ΫϥΠΞϯτ ᶃ ϦΫΤετ ᶄ Ϩεϙϯε
αʔόʔ
@OOParts_JP / #OOPartsGame 11 ಉظ௨৴͕ओྲྀͷαΠτ ΫϥΠΞϯτ ᶃ https://example.com ʹϦΫΤετ ᶄ
Html, CSS, JavaScript ͳͲͷϑΝΠϧΛϨεϙϯε αʔόʔ 11
@OOParts_JP / #OOPartsGame 12 ಉظ௨৴͕ओྲྀͷαΠτ ΫϥΠΞϯτ ᶅ https://example.com/next ͷϦϯΫΛΫϦοΫ ᶆ
Html, CSS, JavaScript ͳͲͷϑΝΠϧΛϨεϙϯε αʔόʔ 12 ※Ұ୴Ωϟογϡແࢹ
@OOParts_JP / #OOPartsGame 13 ϖʔδ୯ҐͰ ϦΫΤετͱϨεϙϯε͕݁͢Δ 13
@OOParts_JP / #OOPartsGame 14 Ajaxͷొ ΫϥΠΞϯτ σʔλΛඇಉظͰૹ৴ αʔόʔ ͜͜ΛΫϦοΫ FOO
/
@OOParts_JP / #OOPartsGame 15 Ajaxͷొ ΫϥΠΞϯτ αʔόʔ ͜͜ΛΫϦοΫ BAR /
Ϩεϙϯε ίϯςϯπ มΘ͍ͬͯΔ 63- มԽͳ͠
@OOParts_JP / #OOPartsGame 16 ඇಉظͰαʔόʔͱ௨৴͠ ཁૉΛߋ৽͍ͯ͘͠ 16
@OOParts_JP / #OOPartsGame 17 Ajaxͷొ ΫϥΠΞϯτ αʔόʔ OFYUҠಈ FOO /
/nextͷϦϯΫΛΫϦοΫ
@OOParts_JP / #OOPartsGame 18 Ajaxͷొ ΫϥΠΞϯτ αʔόʔ Next /next ίϯςϯπ
มΘ͍ͬͯΔ 63- มԽ Html, CSS, JavaScript ͳͲͷϑΝΠϧΛϨεϙϯε ※Ұ୴Ωϟογϡແࢹ
@OOParts_JP / #OOPartsGame 19 ϖʔδͷભҠʹؔͯ͠ ಉظతͳભҠ͕ଟ͔ͬͨ ʢpjaxͱ͔ɺTurbolinksͱ͔ଘࡏ͕ͯͨ͠ɺ͜͜Ͱলུʣ 19
SPAͷొ
@OOParts_JP / #OOPartsGame 21 SPAͷొ ΫϥΠΞϯτ αʔόʔ OFYUҠಈ FOO /
/nextͷϦϯΫΛΫϦοΫ
@OOParts_JP / #OOPartsGame 22 SPAͷొ ΫϥΠΞϯτ αʔόʔ Next /next ίϯςϯπ
มΘ͍ͬͯΔ 63-͕ มԽ ඞཁͳσʔλ͚ͩϨεϙϯε
@OOParts_JP / #OOPartsGame 23 ඇಉظతͳϖʔδભҠͷੈք ωΠςΟϒΞϓϦͷܗʹ͍ۙͮͨ 23
ͦͯ͠ɺPWA
@OOParts_JP / #OOPartsGame 25 SPAͷੈք؍ͱϚον ωΠςΟϒΞϓϦͷΑ͏ʹWebΞϓϦΛѻ͑Δ 25
@OOParts_JP / #OOPartsGame ϒϥβΛىಈ͢Δ URLΛೖྗ ػ ػ ػ OOPartsΛىಈ͢Δ ωΠςΟϒΞϓϦ
ͷΑ͏ʹىಈͰ͖Δ URLόʔ͕ଘࡏ͠ͳ͍ੈք PWAԽ
ͦͯ͠ɺΫϥυήʔϛϯάA
@OOParts_JP / #OOPartsGame ඇಉظత ήʔϜͷϩʔσΟϯά
@OOParts_JP / #OOPartsGame 29 ө૾ΛετϦʔϛϯά৴ ԋࢉॲཧ Ϣʔβ͔Βͷૢ࡞ ήʔϜϓϨΠத ඇಉظత
@OOParts_JP / #OOPartsGame 30 ήʔϜͷੈքɺඇಉظ͕ͨ͘͞Μ 30
@OOParts_JP / #OOPartsGame 31 Ϋϥυ্ͰɺήʔϜΛϓϨΠ͢Δٕज़͕͍͖ͭ ඇಉظతͳελΠϧ͕ओྲྀʹͳͬͨWebͱ PWAʹΑͬͯɺωΠςΟϒͱಉఔͷήʔϜମݧΛ Web্ͰಘΒΕΔΑ͏ʹͳ͖͍ͬͯͯΔ 31
@OOParts_JP / #OOPartsGame 32 32 ͦͯ͠ɺWebͷಛੑͰ͋Δ ৹͕ࠪଘࡏ͠ͳ͍ɺࣗ༝ͳੈք ϒϥβ͑͋͞ΕɺͲ͔͜ΒͰΞΫηεͰ͖Δ ैདྷͷWebͷԸܙΛɺͦͷ··ڗडͰ͖Δ
PWAʹΑΔมԽ
@OOParts_JP / #OOPartsGame 34 34 2.4ഒ 1ഒ ࠶๚͢ΔϢʔβʔ͕ଟ͍ʂ 8.1ਓʹ1ਓ Webܦ༝ʢඞͣ1ճܦ༝ʣ
ͷมԽ Google Analytics ΑΓ ूܭظؒ: 201911݄22 ʙ 20201݄31 ରਓ: ΫϩʔζυϕʔλϢʔβʔ 3500ਓ ΞϓϦܦ༝ AndroidͱiOSͰϑΟϧλ
@OOParts_JP / #OOPartsGame 35 35 ϢʔβʔͷมԽ PWAͷ՝ ͬͯΒ͑Δͱେධ ී௨ʹΒͳ͍ਓଟ͍
͓ΘΓʹ
@OOParts_JP / #OOPartsGame 37 37 Ϋϥυήʔϛϯά ͷεϖοΫͷนΛ͑ ͷछྨͷนΛ͑ ମݧͷนΛ͑ ࠓޙɺΑΓۙͳͷͱͳΔͰ͠ΐ͏
͋Γ͕ͱ͏͍͟͝·ͨ͠