やっていこう。PWA

Df739988f32c42e8c318ef844d6e902b?s=47 oliver
May 15, 2019

 やっていこう。PWA

「PWA Night vol.4 ~PWAのミライや活用方法をみんなで考えよう~」にて登壇した発表資料です。

https://pwanight.connpass.com/event/128434

Df739988f32c42e8c318ef844d6e902b?s=128

oliver

May 15, 2019
Tweet

Transcript

  1. ΍͍ͬͯ͜͏ɻPWA ͓Γ͹ʔʢ@oliver_diaryʣ

  2. ࣗݾ঺հ

  3. ࣗݾ঺հ # Daiki Minakawa ( @oliver_diary ) - Fringe81 Application

    Developer - ࠷ۙ͸Elmॻ͍ͯ·͢ - ৽ଔ̎ϲ݄໨Ͱ͢ - Main : Server Sideʢجຊతʹશ෦΍Δʣ - RailsΛ࢖ͬͯݸਓ։ൃΛ͍ͯ͠Δ
  4. ͲΜͳ͜ͱ࿩͢ʁ • PWAͱ͸ɾ࠷ۙͷPWA • ࣮ࡍͷPWA͸ͲΜͳײ͡ͳͷ͔ • PWAαʔϏεΛϦϦʔεͨ͠ॴײ • PWAΛ໨ࢦ্͢Ͱେࣄͩͱײ͍ͯ͡Δ͜ͱ •

    PWAʹ·ͭΘΔٕज़ͨͪ • PWA͸ࠓޙͲ͏ͳ͍ͬͯ͘ͷ͔
  5. PWAͱ͸

  6. PWAͱ͸ • Progressive Web Apps ͷུ • ϞόΠϧʹݶΒͣσεΫτοϓͷ྆ํͰΠϯετʔϧՄೳ • ΞϓϦͱಉ౳ͷମݧΛఏڙ

    • Reliable, Integrated, Fast, Engaging ͳͲͷUXΛ݉Ͷඋ͑ͨ WebΞϓϦͷ͜ͱͰ͋Γɺಛఆͷٕज़ͷ͜ͱͰ͸ͳ͍ FIRE !!
  7. PWAͱ͸ • Progressive Web Apps: Escaping Tabs Without Losing Our

    Soul • https://infrequently.org/2015/06/progressive-apps-escaping-tabs-without-losing-our-soul/ • 2015೥6݄ͷهࣄ • Progressive Web Appsͷίϯηϓτ͕ॻ͔Ε͍ͯΔ • PWAʹΑͬͯʮdeliver an even better user experience
 ʢ͞Βʹ༏ΕͨϢʔβʔΤΫεϖϦΤϯεΛ࣮ݱʣʯ
  8. PWAͱ͸ • Progressive Web Apps: Escaping Tabs Without Losing Our

    Soul • https://infrequently.org/2015/06/progressive-apps-escaping-tabs-without-losing-our-soul/ • 2015೥6݄ͷهࣄ • Progressive Web Appsͷίϯηϓτ͕ॻ͔Ε͍ͯΔ • PWAʹΑͬͯʮdeliver an even better user experience
 ʢ͞Βʹ༏ΕͨϢʔβʔΤΫεϖϦΤϯεΛ࣮ݱʣʯ
  9. PWAͱ͸ • ͔ͦ͜Β2015೥11݄ʹ։࠵͞Εͨ
 Chrome Dev Summit 2015ͷΩʔϊʔτͰൃද͞Εͯ࿩୊ • https://codelabs.developers.google.com/chrome-dev- summit/

  10. ΋͏3೥൒Ҏ্΋ܦ͍ͬͯΔ

  11. ͍΍ɺ·ͩ3೥൒͔͠ܦ͍ͬͯͳ͍ʁ

  12. ΋͏গ͠۷ΓԼ͍͛ͯ͘

  13. • Reliable
 
 ωοτϫʔΫͷঢ়ଶ͕ෆ҆ఆͳ৔߹Ͱ΋ॠ࣌ʹදࣔ͠ɺΦϑϥΠϯͰ ΋downasaur͕දࣔ͞Εͳ͍Α͏ͳঢ়ଶɻ
 Service WorkerΛ༻͍ͯɺॏཁͳϦιʔεΛࣄલʹΩϟογϡ͓ͯ͘͠ ͜ͱͰɺωοτϫʔΫͷঢ়ଶʹؔ܎ͳ͘ଈ࠲ʹಡΈࠐΉ͜ͱ͕Մೳɻ PWAͱ͸ downasaur

  14. PWAͱ͸ • Integrated
 
 ମݧΛΑΓσόΠεɺOSʹ߹Θͤͨܗʹ͠ɺWebΛҙࣝͤ͞ͳ͍ͱ͍͏ ͜ͱɻ
 ͢ͳΘͪϒϥ΢βΛىಈ͠ͳͯ͘΋WebαΠτΛ։͚ΔɺΈ͍ͨͳঢ়ଶɻ • ϗʔϜը໘ʹ௥Ճ •

    ϑϧεΫϦʔϯදࣔ ͳͲͳͲ
  15. PWAͱ͸ • Fast
 
 ΞχϝʔγϣϯͰ͕׈Β͔Ͱɺૢ࡞ʹ͢͹΍͘൓Ԡͯ͘͠Ε ΔΑ͏ͳঢ়ଶɻ
 ϩʔυʹ3ඵҎ্͔͔Δͱɺ53ˋͷϢʔβʔ͕αΠτΛ཭୤ ͢ΔΒ͍͠ɻ

  16. PWAͱ͸ • Engaging
 
 ΞϓϦͷΑ͏ʹײ͡ΒΕͯɺͷΊΓࠐ·ΕΔΑ͏ͳUX͕͋Δঢ়ଶɻ • ΞϓϦετΞΛඞཁͱͤͣʹϢʔβʔͷϗʔϜը໘ʹ௥Ճ͞ΕΔɻ • ϓογϡ௨஌ͰϢʔβʔʹ௨஌Λಧ͚Δ͜ͱ͕Ͱ͖Δɻ ͳͲͳͲ

  17. ࠷ۙͷPWA

  18. ࠷ۙͷPWAʢAndroidʣ • Google Chrome 56ʢ2017೥2݄ʣ • WebAPKʹΑͬͯWebΛΞϓϦԽͰ͖ΔΑ͏ʹͳΔ • Google Chrome

    68ʢ2018೥7݄ʣ • Add to Home Screen (A2HS) ͔Β Mini-infobar ΁ • Google Chrome 72ʢ2019೥1݄ʣ • Trusted Web Activityʢޙड़ʣ
 PWAΛ Google Play ʹΞϓϦͱͯ͠ొ࿥͢Δ͜ͱ͕Ͱ͖Δʂ A2HS Mini-infobar
  19. ࠷ۙͷPWAʢPC൛Chromeʣ • Google Chrome 67ʢ2018೥5݄ʣ • Chrome OSΛPWAʹରԠ • Google

    Chrome 70ʢ2018೥10݄ʣ • Windows / LinuxΛPWAʹରԠ • Google Chrome 73ʢ2019೥3݄ʣ • macOSΛPWAʹରԠ
  20. ओཁσεΫτοϓOS͢΂ͯͰ
 PWAͷ࣮ߦ؀ڥ͕੔ͬͨ

  21. ໰୊͸iOS

  22. ࠷ۙͷPWAʢiOSʣ • iOS11.3ʢ2018೥1݄ʣ • iOS͕PWAʹରԠ • Service Worker ͕࢖͑ΔΑ͏ʹͳͬͨ •

    ʮϗʔϜը໘ʹ௥Ճʯ͔ΒΠϯετʔϧՄೳ • OauthϩάΠϯ࣌ʹSafariʹඈ͹͞ΕΔ ͳͲͳͲ ͜͜ΑΓઌʹਐΊͳͯ͘ࢮ๢
  23. ͜Ε͸ݫ͍͠…

  24. ࠷ۙͷPWAʢiOSʣ • iOS12.2ʢ2019೥3݄ʣ • Web Share API ʹରԠ • δΣενϟʔʹΑΔφϏήʔγϣϯ


    ʢεϫΠϓͰਐΉɺ໭ΔͳͲʣ • ϚϧνλεΫ࣌ʹ΋ঢ়ଶΛҡ࣋ʢOauthϩάΠϯ͕Մೳʹͳͬͨʣ ϩάΠϯͰ͖ΔΑ͏ʹͳͬͨʂ ͳͲͳͲ
  25. ͋ͱ͸Push௨஌…

  26. ͱ͸͍͑

  27. ͜͜1೥Ͱ͍ͩͿΞπ͍ಈ͖͕དྷ͍ͯΔ

  28. Ͱ͸ɺ࣮ࡍͷPWA͸ͲΜͳײ͡ͳͷ͔

  29. ࣮ࡍͷPWA͸ͲΜͳײ͡ͳͷ͔ • Progressive Web App Checklist • https://developers.google.com/web/progressive-web-apps/checklist • جຊతͳཁ݅͸͜͜ʹॻ͔Ε͍ͯΔ

    • HTTPSඞਢͩͱ͔ɺϞόΠϧϑϨϯυϦʔͩͱ͔ɺϗʔϜը ໘௥Ճͩͱ͔ɺΩϟογϯάͩͱ͔ɺ݁ߏͨ͘͞Μ͋Δɻ
  30. ࣮ࡍͷPWA͸ͲΜͳײ͡ͳͷ͔ • PWAͷඞཁ৚݅Ͱ͸ͳ͍͚ͲWebͰग़དྷΔ͜ͱ • Push௨஌ • Web Share • Payment

    Request • Web Bluetooth • Χϝϥ΍ϚΠΫͷىಈ ͳͲͳͲ • Ґஔ৘ใΛऔಘ • ΦʔσΟΦ΍ϏσΦͷ࠶ੜ੍ޚ • Ճ଎౓ηϯαʔɾδϟΠϩηϯαʔ • ωΠςΟϒΞϓϦͷΠϯετʔϧ֬ೝ
 (getInstalledRelatedApps)
  31. None
  32. ͜͜Ͱ1ͭAPIΛ঺հ

  33. Web Share Target API • https://developers.google.com/web/updates/2018/12/web-share-target • ࠓ·Ͱ͸ωΠςΟϒΞϓϦͷΈ͕ڞ༗λʔήοτͱͯ͠ొ࿥Ͱ͖ͨͷͩ ͕ɺWebͰ΋Մೳʹͳͬͨɻ

  34. ΋ͬͱͨ͘͞Μ૿͑ͯ΄͍͠Ͱ͢Ͷʂʂ

  35. PWAαʔϏεΛϦϦʔεͨ͠ॴײ

  36. PWAαʔϏεΛϦϦʔεͨ͠ॴײ • ͺͪͺͪʮpachipachi.funʯΛ2018೥10݄ʹϦϦʔεͨ͠ɻ • https://github.com/minakawa-daiki/pachipachi.fun-gottani- bon • PWAͱ࣮ͯ͠૷ͨ͠෦෼ • ΦϑϥΠϯΩϟογϡɺPush௨஌

  37. PWAαʔϏεΛϦϦʔεͨ͠ॴײ • ͺͪͺͪʮpachipachi.funʯΛ2018೥10݄ʹϦϦʔεͨ͠ɻ ഥख͢Δ ௨஌͕ಧ͘

  38. PWAαʔϏεΛϦϦʔεͨ͠ॴײ • ͺͪͺͪʮpachipachi.funʯΛ2018೥10݄ʹϦϦʔεͨ͠ɻ • ٕज़ॻయ5Ͱͷຊͷ಺༰Ͱ΋͋ΔɻʢαʔΫϧࢀՃۦಈ։ൃ • ৄ͘͠͸ͪ͜Β -> https://note.mu/oliver0521/n/n14ca5c7aa830 •

    TwitterͰϩάΠϯͯ͠ʮ૬खʹഥखͨ͠Β௨஌͕ඈͿʯͱ͍͏ γϯϓϧͳPWA
  39. PWAαʔϏεΛϦϦʔεͨ͠ॴײ • ͺͪͺͪʮpachipachi.funʯΛ2018೥10݄ʹϦϦʔεͨ͠ɻ • ٕज़ॻయ5Ͱͷຊͷ಺༰Ͱ΋͋ΔɻʢαʔΫϧࢀՃۦಈ։ൃ • ৄ͘͠͸ͪ͜Β -> https://note.mu/oliver0521/n/n14ca5c7aa830 •

    TwitterͰϩάΠϯͯ͠ʮ૬खʹഥखͨ͠Β௨஌͕ඈͿʯͱ͍͏ γϯϓϧͳPWA
  40. 2018೥10݄ʁ

  41. iOS…

  42. PWAαʔϏεΛϦϦʔεͨ͠ॴײ • ౰࣌͸ຊ౰ʹઈ๬͍ͯͯ͠෼͔͍ͬͯΔͷʹԿ౓΋PWA͔Β ʮTwitterϩάΠϯʯΛԡͯ͠Safariʹඈ͹͞ΕΔ༷ΛோΊͨɻ • ͦͯ͠ḷΓண͍ͨ issue ͕ʮmanifestΛऔΓআ͜͏ʯ • https://github.com/GoogleChromeLabs/pwacompat/issues/

    15
  43. ͦͯ͠2019೥3݄…

  44. None
  45. PWAαʔϏεΛϦϦʔεͨ͠ॴײ • iOS12.2͕ϦϦʔε • ʮԿ΋ͯ͠ͳ͍ͷʹյΕͨʯͳΒ͵
 ʮԿ΋ͯ͠ͳ͍ͷʹϩάΠϯͰ͖ΔʯΑ͏ʹͳͬͨɻ • iOSͰͷPush௨஌͸·ͩ Safari ͕ରԠ͍ͯ͠ͳ͍΋ͷͷɺͩ

    ͍Ϳઓ͑ΔΑ͏ʹͳ͖ͬͯͨͱײͨ͡ɻ
  46. PWAΛ໨ࢦ্͢Ͱେࣄͩͱײ͍ͯ͡Δ͜ͱ

  47. PWAΛ໨ࢦ্͢Ͱେࣄͩͱײ͍ͯ͡Δ͜ͱ • ͲͷΑ͏ʹͯ͠Ϣʔβʹʮ௨஌ΛڐՄʯͤ͞Δ͔ • ॳΊͯ๚ΕͨαΠτͰ௨஌ΛڐՄͨ͜͠ͱ͋Δʁ • Ϣʔβʹ௨஌ΛڐՄͤ͞Δͷ͸ɺͱͯ΋೉͍͠ • Ұ౓ڋ൱ͨ͠ϒϥ΢βΛڐՄʹ͢Δͷ΋ɺͱͯ΋೉͍͠

  48. PWAΛ໨ࢦ্͢Ͱେࣄͩͱײ͍ͯ͡Δ͜ͱ • ͲͷΑ͏ʹͯ͠Ϣʔβʹʮ௨஌ΛڐՄʯͤ͞Δ͔ • ॳΊͯ๚ΕͨαΠτͰ௨஌ΛڐՄͨ͜͠ͱ͋Δʁ • Ϣʔβʹ௨஌ΛڐՄͤ͞Δͷ͸ɺͱͯ΋೉͍͠ • Ұ౓ڋ൱ͨ͠ϒϥ΢βΛڐՄʹ͢Δͷ΋ɺͱͯ΋೉͍͠ •

    ಠࣗͷϞʔμϧ΍ϙοϓΞοϓΛڬΉ͜ͱʹΑͬͯճආ
  49. PWAΛ໨ࢦ্͢Ͱେࣄͩͱײ͍ͯ͡Δ͜ͱ • ίϯςϯπͷΩϟογϡઓུ • αʔϏε͝ͱʹਂ͘ߟ͑ͳ͚Ε͹͍͚ͳ͍ • ྫ͑͹ɺ௥هʢߋ৽ʣ͕ଟ͍ϝσΟΞͷ৔߹ɺίϯςϯπ ͷΩϟογϡΛͲ͏͢Δͷ͔ ➡ ͲͷΑ͏ʹͯ͠ίϯςϯπͷ௥هʢߋ৽ʣΛ఻͑Δͷ͔

  50. PWAΛ໨ࢦ্͢Ͱେࣄͩͱײ͍ͯ͡Δ͜ͱ • ίϯςϯπͷΩϟογϡઓུ • ΫΤϦετϦϯάΛ࢖͏ʁ

  51. PWAΛ໨ࢦ্͢Ͱେࣄͩͱײ͍ͯ͡Δ͜ͱ • ίϯςϯπͷΩϟογϡઓུ • ΫΤϦετϦϯάΛ࢖͏ʁ • SNSͰURL͕ڞ༗͞Ε͍ͯͨ৔߹΍͓ؾʹೖΓʹ௥Ճ͞Ε ͍ͯͨ৔߹ʹࠔΔ

  52. PWAΛ໨ࢦ্͢Ͱେࣄͩͱײ͍ͯ͡Δ͜ͱ • ίϯςϯπͷΩϟογϡઓུ • ߋ৽֬ೝ༻ͷϦΫΤετΛඈ͹͢ʁ

  53. PWAΛ໨ࢦ্͢Ͱେࣄͩͱײ͍ͯ͡Δ͜ͱ • ίϯςϯπͷΩϟογϡઓུ • ߋ৽֬ೝ༻ͷϦΫΤετΛඈ͹͢ʁ • ߋ৽͕͋ͬͨ৔߹ʹ̎ճϦΫΤετ͕ൃੜͯ͠͠·͏ • ͔͠΋ฒྻʹॲཧͰ͖ͳ͍ͨΊωοΫͱͳΔ •

    ڐ༰Ͱ͖ΔͳΒଥڠͯ͠΋͍͍͕
  54. PWAΛ໨ࢦ্͢Ͱେࣄͩͱײ͍ͯ͡Δ͜ͱ • ίϯςϯπͷΩϟογϡઓུ • ͜͏͍ͬͨέʔεͷ࣌͸ΩϟογϡͷऔΓѻ͍ʹ஫ҙ͠ͳ͚ Ε͹ͳΒͳ͍

  55. PWAΛ໨ࢦ্͢Ͱେࣄͩͱײ͍ͯ͡Δ͜ͱ • ίϯςϯπͷΩϟογϡઓུ • ͜͏͍ͬͨέʔεͷ࣌͸ΩϟογϡͷऔΓѻ͍ʹ஫ҙ͠ͳ͚ Ε͹ͳΒͳ͍ • ௨৴؀ڥ͕୲อ͞Ε͍ͯΔͳΒαʔόʔ͔ΒऔಘɺΦϑϥ ΠϯͳΒΩϟογϡ͔Βऔಘʹ͢Δ •

    औಘʹ1ඵҎ্͔͔ͬͨ࣌఺ͰΩϟογϡʹ੾Γସ͑ΔͳͲ
  56. PWAʹ·ͭΘΔٕज़ͨͪ

  57. PWAʹ·ͭΘΔٕज़ͨͪ • App Shell • PWA(Progressive Web App)Λߏங͢Δࡍʹ࢖ΘΕΔϞσϧͷҰͭ • UIͳͲͷมΘΒͳ͍෦෼ΛΩϟογϡɺத਎ͷಈతίϯςϯπͩ

    ͚αʔό͔Βऔಘ͢Δ͜ͱͰߴ଎Խ • SPA (React, Vue, Angularͱ͔) ͱ૬ੑ͕͍͍
  58. PWAʹ·ͭΘΔٕज़ͨͪ • ཁ݅ • ಡΈࠐΈ͕ॠ࣌ʹߦΘΕΔ͜ͱ • σʔλ͸࠷খݶͰ͋Δ͜ͱ • ੩తΞηοτ͸ϩʔΧϧͷΩϟογϡΛ༻͍Δ͜ͱ •

    ίϯςϯπͱφϏήʔγϣϯ͸෼཭͞Ε͍ͯΔ͜ͱ • ϖʔδݻ༗ͷίϯςϯπͷऔಘͱද͕࣮ࣔ૷͞Ε͍ͯΔ͜ͱ • ඞཁʹԠ͡ɺಈతίϯςϯπͷΩϟογϡΛߦ͏͜ͱ
  59. PWAʹ·ͭΘΔٕज़ͨͪ • Ionic • ελʔλʔςϯϓϨʔτϨϕϧͰPWAΛαϙʔτ͍ͯ͠Δ • Flutter • Google I/O

    2019 ͰPWAʹରԠ͍ͯ͘͠ํ਑͕ൃද • Nuxt.js • ݸਓతʹΦεεϝɻ࠷ۙ͸͍ͭ΋͓ੈ࿩ʹͳ͍ͬͯΔɻ • Workbox ͕಺แ͞Ε͍ͯΔͨΊѻ͍΍͍͢ɻOneSignal Λ࢖ͬͨϓογϡ௨஌ʹ΋ରԠɻ
  60. PWAʹ·ͭΘΔٕज़ͨͪ • WorkBox • Sevice Workerʹ͓͚ΔɺෳࡶͳϥΠϑαΠΫϧΛϥΠϒϥϦଆͰ΍ͬͯ͘Εɺ Ωϟογϡ؅ཧΛศརʹͯ͘͠ΕΔ΋ͷ • https://developers.google.com/web/tools/workbox/ •

    OneSignal • ؆୯ʹPush௨஌ΛՄೳʹ͢ΔαʔϏε • https://onesignal.com/
  61. PWAʹ·ͭΘΔٕज़ͨͪ • PWA Builder • https://www.pwabuilder.com/ • ϚΠΫϩιϑτ͕ެ։͍ͯ͠ΔPWAͷ։ൃࢧԉπʔϧ • Manifest΍Service

    Worker༻ͷίʔυͳͲɺ༷ʑͳίʔυ Λࣗಈੜ੒ͯ͘͠ΕΔ
  62. PWAʹ·ͭΘΔٕज़ͨͪ • TWA (Trusted Web Activity) • https://medium.com/@firt/google-play-store-now-open-for-progressive- web-apps-ec6f3c6ff3cc •

    Android ൛ Chrome 72 ͷϦϦʔεͱͱ΋ʹਖ਼ࣜʹར༻Մೳ • Chrome ͕ఏڙ͢ΔػೳͰ͋Δ TWA ্Ͱಈ͘ • https://www.slideshare.net/RyuShindo/20190320-pwanight-pwa-to-apk
  63. PWAʹ·ͭΘΔٕज़ͨͪ • TWA (Trusted Web Activity) • खॱ͸গ͠ଟ͍͕ɺ͜ΕʹΑΓPWAΛGoogle Play Storeʹࡌ͚ͬΒΕΔʂ

    • PWAΛAPKʹ͢Δ͜ͱ͕Ͱ͖Δʂ • Chromeͱηογϣϯ΍ετϨʔδɺΩϟογϡͳͲ͸ڞ༗ • PWA͚ͩͰ͸Χόʔ͖͠Εͳ͘ͳͬͨ෦෼͕ग़͖ͯͨͱ͖ʹɺ·ͨθϩ͔ Β։ൃ͢Δඞཁੑ͕গͳ͘ͳΔ
  64. PWAʹ·ͭΘΔٕज़ͨͪ • TWA (Trusted Web Activity) • ެࣜͷ΍Γํ • https://developers.google.com/web/updates/2019/02/using-twa

    • ͜Μͳͷ΋͋Δ • https://appmaker.xyz • ςετͰαΫοͱࢼ͍ͨ͠ͱ͖ʹΦεεϝ
  65. PWAʹ·ͭΘΔٕज़ͨͪ

  66. PWAʹ·ͭΘΔٕज़ͨͪ

  67. PWAʹ·ͭΘΔٕज़ͨͪ

  68. PWAʹ·ͭΘΔٕज़ͨͪ

  69. PWAʹ·ͭΘΔٕज़ͨͪ

  70. PWA͸ࠓޙͲ͏ͳ͍ͬͯ͘ͷ͔

  71. ઌ೔ͷ Google I/O 2019 ʹͯ

  72. ઌ೔ͷ Google I/O 2019 ʹͯ • ࠓޙ௥Ճ͞ΕΔ༧ఆͷ༷ʑͳAPI͕ൃද͞Εͨ • https://www.youtube.com/watch?v=GSiUzuB-PoI •

    ·ͩग़Δ͔Θ͔Βͳ͍΋ͷ΍ɺະ֬ఆͳ΋ͷ͋Δ͕ɺͱͯ ΋ϫΫϫΫ͢Δ΋ͷ͹͔Γ
  73. ઌ೔ͷ Google I/O 2019 ʹͯ • Web Share Target API

    v2 • ϑΝΠϧ΋ڞ༗Ͱ͖ΔΑ͏ʹͳΔ • Shape Detection API • إݕग़ɺόʔίʔυݕग़ɺςΩετݕग़ͳͲ͕Մೳʹ • Badging API • ΞϓϦΞΠίϯʹόοδΛ෇༩͢Δ͜ͱ͕Մೳʹ
  74. Badging API

  75. ઌ೔ͷ Google I/O 2019 ʹͯ • Wake Lock API •

    ૢ࡞͍ͯ͠ͳ͍࣌ͷը໘ͷϩοΫΛ๷͙ • Native File System API • ϩʔΧϧͷϑΝΠϧΛΘ͟Θ͟Ξοϓϩʔυͯ͠ɺมߋ͔ͯ͠Βμ΢ϯϩʔυ͢ Δͱ͍͏खؒΛແͤ͘Δ • Serial API • ϚΠΫϩίϯτϩʔϥ΍3DϓϦϯλͳͲͱ௨৴Ͱ͖ΔΑ͏ʹͳΔ
  76. ઌ೔ͷ Google I/O 2019 ʹͯ • WebHID • ήʔϜύουͳͲͷHIDυϥΠόʹΑ੍ͬͯޚ͞Ε͍ͯͯWebʹΞΫηεͰ͖ͳ͍HID ΁ͷ੍ޚ͕Մೳʹ

    • Contacts Picker • Ϣʔβͷ࿈བྷઌʹΞΫηεͰ͖ΔΑ͏ʹͳΔ • Font Access API • ϩʔΧϧʹΠϯετʔϧ͞Ε͍ͯΔϑΥϯτͷऔಘ΍ϑΥϯτͷৄࡉʹΞΫηεͰ͖Δ
  77. Font Access API

  78. None
  79. None
  80. None
  81. ·ͱΊ • ࣮֬ʹɺணʑͱPWA͸ݱ࣮తͳ΋ͷʹͳ͖͍ͬͯͯΔ • SafariͷରԠ࣍ୈͰ͸ɺ͔ͳΓԽ͚Δ • PWAΛετΞʹࡌ͚ͬΔͷ͕ओྲྀʹͳΔ࣌୅͕དྷΔͷ͔΋ • ΑΓ؆୯ʹ։ൃͰ͖ΔϓϥοτϑΥʔϜ͕ग़͖ͯͯ΋͓͔͘͠ͳ͍ •

    ༷ʑͳAPI͕ࠓޙ΋ग़ͯ͘ΔͷͰཁ஫໨ • ΑΓωΠςΟϒʹ͍͍ۙͮͯ͘ɻ։ൃΛWebʹدͤΒΕΔঢ়گ͸ྑ͍͜ͱ
  82. ͋Γ͕ͱ͏͍͟͝·ͨ͠