やっていこう。PWA

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

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

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)
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݄…
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
81. ·ͱΊ • ࣮֬ʹɺணʑͱPWA͸ݱ࣮తͳ΋ͷʹͳ͖͍ͬͯͯΔ • SafariͷରԠ࣍ୈͰ͸ɺ͔ͳΓԽ͚Δ • PWAΛετΞʹࡌ͚ͬΔͷ͕ओྲྀʹͳΔ࣌୅͕དྷΔͷ͔΋ • ΑΓ؆୯ʹ։ൃͰ͖ΔϓϥοτϑΥʔϜ͕ग़͖ͯͯ΋͓͔͘͠ͳ͍ • ༷ʑͳAPI͕ࠓޙ΋ग़ͯ͘ΔͷͰཁ஫໨ • ΑΓωΠςΟϒʹ͍͍ۙͮͯ͘ɻ։ൃΛWebʹدͤΒΕΔঢ়گ͸ྑ͍͜ͱ
82. ͋Γ͕ͱ͏͍͟͝·ͨ͠