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

PWAゲームを開発しネイティブアプリ化までした中での課題と対策

 PWAゲームを開発しネイティブアプリ化までした中での課題と対策

builderscon tokyo 2019 の発表資料です

Avatar for Masaaki Goshima

Masaaki Goshima

August 30, 2019
Tweet

More Decks by Masaaki Goshima

Other Decks in Technology

Transcript

  1. ࣗݾ঺հ • FYNJYJ *OD d • 1FSMॲཧܥ .4($ +*5 1FSM.PUJPO

    • 4/4NJYJϞϯελʔετϥΠΫͷαʔόɾΫϥΠΞϯτ։ൃ • ϚϧνϓϨΠͷνʔτରࡦج൫ J04ɾ"OESPJE༻ͷ࿥ը4%, ಈըͷੜ഑৴ج൫ͳͲ • LOPDLOPUF *OD d • αʔό (Pݴޠ༻ͷෛՙ෼ࢄϥΠϒϥϦΞϓϦέʔγϣϯ'8 • ΫϥΠΞϯτ QJYJBGUFSFGGFDUT௨৴ྔ࡟ݮ νʔτରࡦ  ΠϯήʔϜ • Πϯϑϥ $IBU0QT σϓϩΠͳͲ HPDDZ !HPDDZ
  2. גࣜձࣾϊοΫϊʔτ • ೥݄૑ۀͷήʔϜձࣾ IUUQTLOPDLOPUFDPKQ • ˞ϓϩάϥϛϯάڭҭࣄۀΛ΍͍ͬͯΔձࣾͰ͸͋Γ·ͤΜ • ೥݄ 18"ήʔϜΛϦϦʔε •

    ʮ18" 9ήʔϜʯͷઌۦ͚ͱͳͬͨ௒༗໊λΠτϧΛ։ൃ • ΫϥΠΞϯτɾαʔόɾΠϯϑϥશͯࣗࣾͰ։ൃɾӡ༻ • ӡ༻தͷλΠτϧͰ࢖༻͍ͯ͠ΔϥΠϒϥϦ͸044ͱͯ͠ ੵۃతʹެ։ • (JU)VCIUUQTHJUIVCDPNLOPDLOPUF
  3. "OESPJE $ISPNF ͳΒͱ͍͏ݬ૝ ཧ૝ • ʮ"OESPJE9$ISPNFʯͳΒ͹ɺٕज़తʹ͸ $BDIF4UPSBHF ͱ 1FSTJTUFOU4UPSBHFͷ૊Έ߹Θͤ Ͱେ༰ྔΞηοτͷӬଓԽ͕Ͱ͖Δ

    • $BDIF4UPSBHF )551ϨεϙϯεͷΩϟογϡ • 1FSTJTUFOU4UPSBHFετϨʔδӬଓԽ ݱ࣮ • ετϨʔδӬଓԽͷ৚͕͔݅ͳΓෳࡶͰݫ͍͠
  4. ετϨʔδӬଓԽΛ ຊ൪౤ೖͰ͖ΔՄೳੑ • (PPHMF͕ެࣜʹൃද͍ͯ͠ͳ͍ෳࡶͳ࢓༷͕͋Δ • ৄࡉ͸ԼͷϦϯΫઌΛࢀর • Ұ౓ӬଓԽͷڐՄΛಘͨαΠτͰ΋ɺ࣍·ͨڐՄ͞Ε Δ͔͸Θ͔Βͳ͍ ଞͷαΠτͷঢ়گ࣍ୈ

    • ͨͩ͠ 164)௨஌ͷڐՄΛͱΕΔલఏ͕͋Ε͹࠾༻ Ͱ͖ΔՄೳੑ͕͋Δ • ':* $ISPNFͰετϨʔδӬଓԽΛ࣮ݱ͢Δʹ͸ • IUUQTXXXTMJEFTIBSFOFUHPDDZDISPNF • IUUQTRJJUBDPNHPDDZJUFNTEEDBDE 
  5. $BDIF$POUSPMରԠ • JOEFYIUNM ౳ͷಡΈࠐΈͷى఺ͱͳΔϑΝΠϧҎ֎͸ ͢΂ͯ NBYBHF ೥ ʹ͢Δ • $%/΁ߋ৽֬ೝϦΫΤετ͢Βඈ͹͞ͳ͍

    • ಉҰͷΞηοτΛߋ৽͍ͨ͠ͱ͖ʹΩϟογϡ͕ޮ͘ ͱࠔΔͨΊɺඞͣΫΤϦʹόʔδϣϯ൪߸΍ϋογϡ ஋Λ͚ͭΔ • IUUQTFYBNQMFDPNBTTFUTJNBHFTQOH W • IUUQTFYBNQMFDPNBTTFUTJNBHFTQOH WFBG G
  6. $%/ͰࣗಈѹॖඇରԠϑΝΠϧͷ H[JQѹॖ • 4ʹΞοϓϩʔυ͢Δࡍɺl$POUFOU&ODPEJOHH[JQzΛ ͚͓͚ͭͯ͹ɺͲΜͳΞηοτͰ΋ H[JQ ѹॖࡁΈͱ͠ ͯ഑৴Ͱ͖Δ • ϑΝΠϧܗࣜʹΑͬͯѹॖޮ཰͕มΘΔͷͰɺ

    -JHIUIPVTFΛࢀߟʹ͢Δͱ͍͍ • ࣮͸ NB ΍ XBTN ͸ѹॖޮ཰͕ྑ͍ͷͰޮՌ͕ߴ͍ $POUFOU&ODPEJOHH[JQ 4 0SJHJO $MPVE'SPOU QBTTUISPVHI H[JQల։ H[JQѹॖࡁΈ VQMPBE
  7. ϚελʔσʔλΛ αʔόɾΫϥΠΞϯτͲͪΒͰ؅ཧ͢΂͖͔ ΫϥΠΞϯτ؅ཧ ϝϦοτ • αʔόͷϨεϙϯεΛΑΓ଎͘ɾܰ͘ฦͤΔΑ͏ʹͳΔ σϝϦοτ • อଘ༰ྔʹ੍ݶ͕͋Δ ϞόΠϧ4BGBSJͰ͸

    *OEFYFE%#Ͱ΋࠷େ.# • ϑΝΠϧΛ࢖͏ͱ-36Ͱফ͑Δ͔΋͠Εͳ͍ • อଘ͍ͯ͠Δσʔλͷ࿙ӮϦεΫ αʔό؅ཧ ϝϦοτ • ඞཁͳ৘ใ͕͢΂ͯϨεϙϯεʹؚ·ΕΔͷͰγϯϓϧ σϝϦοτ • Ϛελʔσʔλͷඥ෇͚ॲཧͷӨڹͰԠ౴ੑೳ͕ѱ͘ͳΔՄೳੑ͕͋Δ • Ϩεϙϯε͕ංେԽ͠΍͍͢ • ϨεϙϯεΛಡ·ΕΔͱඞཁͳ৘ใ͕Θ͔ͬͯ͠·͏
  8. Ϛελʔσʔλͷߴ଎ݕࡧ • Ϛελʔσʔλ͸͢΂ͯΞϓϦέʔγϣϯαʔό্ʹ Ωϟογϡ • IUUQTHJUIVCDPNLOPDLOPUFSBQJEBTI • # 5SFFߏ଄Ͱల։͞ΕΔͷͰൣғݕࡧՄೳ •

    2JJUB (PݴޠͷͨΊͷΩϟογϡϥΠϒϥϦΛ࡞ͬͨ • ґଘ͢Δσʔλ͸ &BHFS-PBEJOHͰऔಘ͢Δ • ྫ XPSME$PVOUSJFT $JUJFT 1BSLT 8PSME $PVOUSZ" $PVOUSZ# 1BSL" 1BSL# 1BSL$ 1BSL% 1BSL& 1BSL' 1BSL( 1BSL) DPVOUSZ@JE*/ " # DJUZ@JE*/ " # $ % QBSL@JE*/ " # $ % & ' ( ) DPVOUSZ@JE DJUZ@JE QBSL@JE ൃߦ͞ΕΔΫΤϦͷ 8)&3&จ $JUZ# $JUZ" $JUZ$ $JUZ%
  9. $MJFOU "QQMJDBUJPO $%/ $MPVE'SPOU 0SJHJO 4 IUUQTFYBNQMFDPNBTTFUTPCGVTDBUJPOQBUI UFYU JNBHF "TTFUT

    OHJOY "11 1045IUUQTBQJFYBNQMFDPN (&5VTFST +40/ "1* ڞ௨伴҉߸Ͱ҉߸ԽࡁΈ νʔτରࡦશମਤ
  10. $MJFOU "QQMJDBUJPO $%/ $MPVE'SPOU 0SJHJO 4 IUUQTFYBNQMFDPNBTTFUTPCGVTDBUJPOQBUI UFYU JNBHF "TTFUT

    OHJOY "11 1045IUUQTBQJFYBNQMFDPN (&5VTFST +40/ "1* ΞηοτͷൿಗԽ
  11. Ξηοτύεͷ೉ಡԽ • ͳͥ೉ಡԽ͢Δ͔ • Ξηοτύε͕ྨਪՄೳͳ৔߹ɺެ։લͷΞηοτΛൈ͔ΕΔ ϦεΫ͕͋Δ ରࡦྫ • ύεͷ్தʹαʔό͔Β෷͍ग़ͨ͠ϋογϡ஋ΛؚΊΔ •

    ϩʔΧϧʹอଘͨ͋͠ͱɺϑΝΠϧ໊͔Β಺༰Λਪଌ͞Ε΍͍͢ • ύεશମΛϋογϡԽ • ֦ுࢠࠐΈͷϑΝΠϧ໊΋ؚΊͨ׬શͳύεΛϋογϡԽ • ϋογϡԽ͞Εͨ͋ͱͷύεΛ࢖ͬͯσόοά͢Δͷ͕ࠔ೉
  12. ࣮ࡍͷΞηοτύεͷྨਪରࡦ • αʔό͔Β෷͍ग़ͨ͠஋ΛؚΉύεશମΛϋογϡԽ • $ Ͱॻ͍ͨϩδοΫΛར༻ • (PͰॻ͔ΕͨΞηοτΞοϓϩʔμܦ༝ͰϋογϡԽ • ࢀর࣌͸&NTDSJQUFOͰ8FC"TTFNCMZԽͨ͠Ϟδϡʔϧܦ༝

    • ύεશମͷϋογϡԽ͸εςʔδϯάҎ্ͷ؀ڥʹݶఆ "TTFU 6QMPBEFS DHP ϋογϡԽ VQMPBE &NTDSJQUFO XBTNʹม׵ $MJFOU "QQMJDBUJPO GJMFKTPO ΛϋογϡԽ (&5CHIB GJMFKTPO ม׵ޙ CHIB
  13. &NTDSJQUFO • $$ Ͱॻ͍ͨίʔυΛ+BWB4DSJQU XJUIBTNKT ΍ 8FC"TTFNCMZʹม׵͢ΔίϯύΠϥ • ม׵͞Εͨιʔείʔυ͸ਓ͕ؒಡΉΑ͏ʹͰ͖͍ͯͳ͍ •

    ฐࣾͰ͸νʔτରࡦ·ΘΓͰར༻ • $ ͔Β؆୯ʹϒϥ΢β"1*Λ͚ͨͨΔϥΠϒϥϦΛར༻ MJCIUNMIUUQTHJUIVCDPNLOPDLOPUFMJCIUNM • ੜ੒͞Εͨ XBTNΛՃ޻ͯ͠ϝϞϦ࢖༻ྔ΍ϑΝΠϧαΠζΛ཈͑ ͯӡ༻ IUUQTHJUIVCDPNLOPDLOPUFXBTN • 2JJUB ೥ؒຊ൪؀ڥͰ 8FC"TTFNCMZΛ࢖͖ͬͯͨதͰ ੜͨ͡໰୊ͱͦͷղܾࡦ
  14. ը૾ͷ҉߸Խ  • 8FC(-3FOEFSJOH$POUFYUUFY 4VC *NBHF%ʹ͸ *NBHF#JUNBQΛ౉͢͜ͱ͕Ͱ͖Δ • ࣍ͷखॱͰ )5.-*NBHF&MFNFOUΛܦ༝ͤͣʹ௚઀

    (16ʹΞοϓϩʔυͰ͖Δ  ҉߸Խ͞Εͨը૾σʔλΛ9)3Ͱऔಘ  ෮߸  *NBHF#JUNBQʹม׵  HMUFY*NBHF% ʹ *NBHF#JUNBQΛ౉͢ ˞*NBHF#JUNBQ͸ϝϞϦΛ৯͏ͷͰɺෳ਺ຕಉ࣌ʹ࢖͏৔߹͸஫ҙ
  15. $MJFOU "QQMJDBUJPO $%/ $MPVE'SPOU 0SJHJO 4 IUUQTFYBNQMFDPNBTTFUTPCGVTDBUJPOQBUI UFYU JNBHF "TTFUT

    OHJOY "11 1045IUUQTBQJFYBNQMFDPN (&5VTFST +40/ "1* "1*௨৴ͷൿಗԽ
  16. )551ϦΫΤετͷ҉߸Խ • ϦΫΤετ಺༰Λ$$ Ͱॻ͍ͨڞ௨伴҉߸ํࣜͰ҉߸Խɾ෮߸ • ҉߸Խ͸&NTDSJQUFOͰ8FC"TTFNCMZԽͨ͠Ϟδϡʔϧܦ༝ • ෮߸͸ࣗ࡞ͷ OHJOY NPEVMFܦ༝

    • OHY@IUUQ@QSPYZ@NPEVMFͷ୅ΘΓʹ࢖༻ $MJFOU "QQMJDBUJPO (&5VTFST 1045 (&5VTFST Λ҉߸Խͨ͠಺༰ OHJOY ෮߸ͯ͠ϓϩΩγ &NTDSJQUFO "QQMJDBUJPO 4FSWFS )551ϦΫΤετશจΛ҉߸Խ͠ɺ1045ͷ CPEZʹೖΕͯૹΔ
  17. $MJFOU "QQMJDBUJPO OHJOY "11 1045IUUQTBQJFYBNQMFDPN (&5VTFST +40/ "1* $%/ $MPVE'SPOU

    0SJHJO 4 IUUQTFYBNQMFDPNBTTFUTPCGVTDBUJPOQBUI UFYU JNBHF "TTFUT ΞϓϦέʔγϣϯίʔυͷൿಗԽ
  18. ڞ௨伴҉߸ͷ伴΍ϩδοΫΛकΔ  ΞϓϦέʔγϣϯίʔυΛӅṭ͢Δ • FWBMͨ͠ίʔυ͸ %FWFMPQFS5PPMTʹදࣔ͞Εͳ͍ • TPVSDF63-IUUQTFYBNQMFDPNBQQKT ͷΑ͏ʹ TPVSDF63-Λ෇༩ͯ͠FWBM͢Δͱ

    4PVSDF.BQ΋࢖͑Δ • TPVSDF63-Λ͚ͭΔͱϒϥ΢β͕ྑ͔Εͱࢥͬͯ%FWFMPQFS 5PPMTʹ໊લ෇͖ͰιʔείʔυΛදࣔͯ͠͠·͏ • ιʔείʔυͳ͠ͷঢ়ଶͰҰ౓FWBM͓ͯ͘͠ͱରࡦͰ͖Δ લޙͰιʔείʔυͳ͠ͷঢ়ଶͰ FWBM
  19. ڞ௨伴҉߸ͷ伴΍ϩδοΫΛकΔ  ιʔείʔυࣗମΛकΔ $MJFOU "QQMJDBUJPO  $MJFOU "QQMJDBUJPO $MJFOU "QQMJDBUJPO

     FWBM  $MJFOU "QQMJDBUJPO  9)3Ͱ҉߸ԽࡁΈίʔυΛऔಘ ෮߸ ΞϓϦέʔγϣϯͷ࣮ߦ &NTDSJQUFO ˞೉ಡԽ͞Ε͍ͯΔ
  20. HMPCBM"1*ͷϑοΫ͔ΒकΔ  • $ISPNFͷϩʔΧϧΦʔόʔϥΠυͱ૊Έ߹Θͤͯ XJOEPX+40/΍ XJOEPXSFRVFTU"OJNBUJPO'SBNF ΛϑοΫ͢Δख๏͕͋Δ • $ISPNFͷϩʔΧϧΦʔόʔϥΠυ •

    8FCαΠτͷ೚ҙͷϑΝΠϧΛϩʔΧϧ্ʹอଘ͞Ε͍ͯΔ ΋ͷʹஔ͖׵͑Δ͜ͱ͕Ͱ͖Δػೳ • ؆୯ʹطଘͷॲཧΛॻ͖׵͑ͨΓ೚ҙͷॲཧΛ௥ՃͰ͖Δ
  21. ΠϯήʔϜϩδοΫΛकΔ  ϩδοΫΛͲ͜Ͱಈ͔͢΂͖͔ • ΠϯήʔϜ • ήʔϜͷߏ੒ΛΠϯήʔϜͱΞ΢τήʔϜʹ෼͚Δͱɺ ΠϯήʔϜ͸༡ͼͷίΞͳ෦෼ • ϩδοΫ͸νʔτରࡦͷ؍఺Ͱ͸αʔόͰಈ͔ͨ͠ํ͕

    ྑ͍͕ɺ໰୊΋͋Δ • ΫϥΠΞϯτΤϯδχΞ͕αʔόͷΞϓϦέʔγϣϯίʔυΛ هड़͢Δϋʔυϧͷߴ͞Λ௒͑ΒΕͳ͍͜ͱ͕ଟ͍ • ήʔϜʹΑͬͯ͸αʔόͷԠ౴଎౓ʹ஫ҙ͢Δඞཁ͕͋Δ
  22. ΠϯήʔϜϩδοΫΛकΔ  ࣮ࡍͷରԠ • ΠϯήʔϜϩδοΫΛ$ Ͱهड़͠αʔόɾΫϥΠΞϯτؒͰڞ༗ • ΫϥΠΞϯτͰܭࢉ͠ը໘ʹ݁ՌΛද͍ࣔͯ͠ΔҰํɺ ཪͰಉ͡ϩδοΫΛαʔόଆͰಈ͔͠όϦσʔγϣϯ͢Δ •

    λʔϯ੍ͷήʔϜͳͷͰɺຖλʔϯαʔόͱ௨৴ͯ݁͠ՌΛಥ͖߹Θ ͤΔ • ΋͠ҧ͑͹αʔόଆͷ݁ՌΛਅͱ͢Δ • αʔόଆͰ͸ήʔϜͷਐߦঢ়ଶΛ3FEJTʹอଘ $MJFOU "QQMJDBUJPO &NTDSJQUFO ࣮ߦɾදࣔ 4FSWFS "QQMJDBUJPO DHP ήʔϜঢ়ଶͷऔಘ ήʔϜঢ়ଶͷอଘ ຖλʔϯ௨৴ͯ͠੔߹ੑνΣοΫ ࣮ߦ