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

Chrome チームの推すこれからくる新しい Web API / Upcoming Web APIs advocated by the Chrome team

nodaguti
December 19, 2018

Chrome チームの推すこれからくる新しい Web API / Upcoming Web APIs advocated by the Chrome team

Frontrend Vol.13 (https://frontrend.connpass.com/event/110449) での発表資料です.
アップロード用に,口頭で説明した内容を補足で追加してあります.

nodaguti

December 19, 2018
Tweet

More Decks by nodaguti

Other Decks in Technology

Transcript

  1. DISPNFEFWTVNNJUCSJFpOHTFTTJPO
    Frontrend Vol.13 on Dec 19th, 2018
    @nodaguti
    Chrome νʔϜͷਪ͢
    ͜Ε͔Β͘Δ৽͍͠ Web API

    View full-size slide

  2. About me
    DISPNFEFWTVNNJUCSJFpOHTFTTJPO
    Tadahiro Noguchi / ໺ޱ ௚׮
    @nodaguti
    • CyberAgent, Inc. 2018೥৽ଔೖࣾ
    • AbemaTV ։ൃຊ෦ Web νʔϜॴଐ
    • ࠷ۙ͸ϞόΠϧ΢Σϒ൛ͷػೳ௥ՃΛߦ͍ͬͯ·͢

    View full-size slide

  3. DISPNFEFWTVNNJUCSJFpOHTFTTJPO
    Sessions
    • Building Modern Web Media Experiences: Picture-in-
    Picture and AV1
    • Making Modern Web Content Discoverable for Search
    • Feature Policy & the Well-Lit Path for Web
    Development
    • virtual-scroller: Let there be less (DOM)
    • From Low Friction to Zero Friction with Web Packaging
    and Portals
    • State of Houdini
    • Building Engaging Immersive Experiences

    View full-size slide

  4. DISPNFEFWTVNNJUCSJFpOHTFTTJPO
    Sessions
    • Building Modern Web Media Experiences: Picture-in-
    Picture and AV1
    • Making Modern Web Content Discoverable for Search
    • Feature Policy & the Well-Lit Path for Web
    Development
    • virtual-scroller: Let there be less (DOM)
    • From Low Friction to Zero Friction with Web Packaging
    and Portals
    • State of Houdini
    • Building Engaging Immersive Experiences

    View full-size slide

  5. DISPNFEFWTVNNJUCSJFpOHTFTTJPO
    Picture-in-picture (PiP)
    • ӈԼͷը૾ͷΑ͏ʹը໘ͷ୺ʹ࠶ੜதͷಈըΛ float
    ͓͚ͤͯ͞Δٕज़
    • Android 8+, iOS 10+ (iPad), Chrome 70+
    • Chrome 70+ Ͱ JS ͔Β੍ޚͰ͖Δ API Λ౥ࡌ
    • PiP Ϟʔυ΁ͷ enter / leave
    • ্هʹؔ͢ΔΠϕϯτ
    • PiP Ϟʔυͷ

    ΢Οϯυ΢αΠζऔಘ

    View full-size slide

  6. DISPNFEFWTVNNJUCSJFpOHTFTTJPO
    Media Capture and Streams API ͱͷ૊Έ߹Θͤ
    ΢ΣϒΧϝϥ͔Β
    ͷө૾Λ
    PiP ͰදࣔͰ͖Δ

    View full-size slide

  7. DISPNFEFWTVNNJUCSJFpOHTFTTJPO
    AV1
    • Open-source, royalty-free ͳ৽͍͠ಈըίʔσοΫ
    • VP9 ΑΓ΋ 30% খ͍͞ϏοτϨʔτͰಉը࣭Λ࣮ݱ
    • ϑϩϯτΤϯυؔ࿈ͷ࿩୊ͱͯ͠͸:
    • Media Source Extensions: SourceBuffer.changeType
    • ࠶ੜதʹಈతʹίϯςφ/ίʔσοΫΛ੾Γସ͑Β
    ΕΔΑ͏ʹ͢Δ API
    • ΫϥΠΞϯταΠυͰ AV1 ͷ࠶ੜ͕ݫ͍͠৔߹
    ʹ VP9 ʹϑΥʔϧόοΫ͢ΔͳͲͷ੍ޚ͕Ͱ͖Δ

    View full-size slide

  8. DISPNFEFWTVNNJUCSJFpOHTFTTJPO
    ॴײ
    • AbemaTV Ͱ΋༗๬ͳٕज़ͱͯ͠஫໨͍ͯ͠Δ
    • PiP
    • PiP ͸ video ཁૉ͝ͱͷద༻
    • DRM ༗ແͷ੾ΓସΘΓͳͲͰετϦʔϜ͕มΘΔ
    ͱ video ཁૉ͕࠶ੜ੒͞ΕΔɽ͜͏ͨ͠Τοδέʔ
    ε΁ͷରԠΛߦ͏ඞཁ͕͋Δ
    • AV1
    • ಛʹϚϧνσόΠεͰల։͍ͯ͠Δ৔߹ʹ͸ɼσ
    ίʔμʔ͕Ͳ͜·Ͱීٴ͢Δ͔ʁ͕ΧΪ

    View full-size slide

  9. DISPNFEFWTVNNJUCSJFpOHTFTTJPO
    Sessions
    • Building Modern Web Media Experiences: Picture-in-
    Picture and AV1
    • Making Modern Web Content Discoverable for Search
    • Feature Policy & the Well-Lit Path for Web
    Development
    • virtual-scroller: Let there be less (DOM)
    • From Low Friction to Zero Friction with Web Packaging
    and Portals
    • State of Houdini
    • Building Engaging Immersive Experiences

    View full-size slide

  10. DISPNFEFWTVNNJUCSJFpOHTFTTJPO
    Sessions
    • Building Modern Web Media Experiences: Picture-in-
    Picture and AV1
    • Making Modern Web Content Discoverable for Search
    • Feature Policy & the Well-Lit Path for Web
    Development
    • virtual-scroller: Let there be less (DOM)
    • From Low Friction to Zero Friction with Web Packaging
    and Portals
    • State of Houdini
    • Building Engaging Immersive Experiences

    View full-size slide

  11. DISPNFEFWTVNNJUCSJFpOHTFTTJPO
    • Client-side rendering ͳϖʔδͷ SEO ʹ͍ͭͯ
    • લఏ1: ݱࡏͷ Googlebot ͸ɼJS-heavy ͳϖʔδͷ
    index ԽΛ࠷େ1िؒ஗Ԇͤ͞Δ
    • લఏ2: ݱࡏͷ Googlebot ͸ Chrome 41 ૬౰
    ෛՙ͕͔͔Δϖʔδ͸
    3FOEFS2VFVFͰ
    ஗Ԇ͞Εͯ͠·͏

    View full-size slide

  12. DISPNFEFWTVNNJUCSJFpOHTFTTJPO
    Workaround: Dynamic Rendering
    • SPA ͱ SSR ͷதؒ
    • Web αʔό͕ฦͨ͠
    SPA Λ Dynamic
    Renderer Ͱॲཧͯ͠
    static HTML ʹม׵͠ɼ
    Ϋϩʔϥʔʹฦ͢
    • Puppeteer, Rendertron
    ͳͲ͕࢖͑Δ

    View full-size slide

  13. DISPNFEFWTVNNJUCSJFpOHTFTTJPO
    • Google Mobile-Friendly Test
    • JS ͷΤϥʔͳͲΛݟΒΕΔΑ͏ʹ
    Google Search Console ͷΞοϓσʔτ

    View full-size slide

  14. DISPNFEFWTVNNJUCSJFpOHTFTTJPO
    • Rich Results Test
    • ίʔυΛೖྗͯͦ͠ͷ৔ͰςετͰ͖ΔΑ͏ʹ
    Google Search Console ͷΞοϓσʔτ

    View full-size slide

  15. DISPNFEFWTVNNJUCSJFpOHTFTTJPO
    ॴײ
    • Dynamic Rendering
    • SPA ͷ SEO ରࡦ͸ҎԼͷͲͷखஈΛऔΔ͔ͷબ
    ୒ʹͳΓͦ͏
    • SSR ͢Δ
    • Chrome 41 ޲͚ͷϏϧυΛ࡞ͬͯ഑৴͢Δ
    • Dynamic Rendering ΛηοτΞοϓΛ͢Δ
    • ΋͠؆қʹ૊ΈࠐΊΔ full-managed ͳαʔϏε͕
    ग़ͯ͘Ε͹ workaround ͱͯ͠࢖͏ͷ͸Αͦ͞͏

    View full-size slide

  16. DISPNFEFWTVNNJUCSJFpOHTFTTJPO
    Sessions
    • Building Modern Web Media Experiences: Picture-in-
    Picture and AV1
    • Making Modern Web Content Discoverable for Search
    • Feature Policy & the Well-Lit Path for Web
    Development
    • virtual-scroller: Let there be less (DOM)
    • From Low Friction to Zero Friction with Web Packaging
    and Portals
    • State of Houdini
    • Building Engaging Immersive Experiences

    View full-size slide

  17. DISPNFEFWTVNNJUCSJFpOHTFTTJPO
    Sessions
    • Building Modern Web Media Experiences: Picture-in-
    Picture and AV1
    • Making Modern Web Content Discoverable for Search
    • Feature Policy & the Well-Lit Path for Web
    Development
    • virtual-scroller: Let there be less (DOM)
    • From Low Friction to Zero Friction with Web Packaging
    and Portals
    • State of Houdini
    • Building Engaging Immersive Experiences

    View full-size slide

  18. DISPNFEFWTVNNJUCSJFpOHTFTTJPO
    Feature Policy
    ΢ΣϒϖʔδΛ࡞Δࡍͷ best practices ʹԊ͍ͬͯΔ
    ͔ɼCSP ͱಉ͡Α͏ͳܗͰ validate Ͱ͖Δ࢓૊Έ

    View full-size slide

  19. DISPNFEFWTVNNJUCSJFpOHTFTTJPO
    Feature Policy
    ΢ΣϒϖʔδΛ࡞Δࡍͷ best practices ʹԊ͍ͬͯΔ
    ͔ɼCSP ͱಉ͡Α͏ͳܗͰ validate Ͱ͖Δ࢓૊Έ

    View full-size slide

  20. DISPNFEFWTVNNJUCSJFpOHTFTTJPO
    Reporting API
    • CSP, FP, Τϥʔ, Ϋϥογϡ, ඇਪ঑ػೳͷ࢖༻ͳͲͱ
    ͍ͬͨ warnings/errors Λ௨஌͢ΔҰݩతͳ࢓૊Έ
    • ίϯιʔϧ͕ϝοηʔδͰຒ΋Εͯ͠·͍͕ͪͩͬͨ
    ͷΛղফ͢Δ

    View full-size slide

  21. DISPNFEFWTVNNJUCSJFpOHTFTTJPO
    ॴײ
    • Feature Policy
    • ศརͦ͏͕ͩɼຊ֨తͳରԠɾ׆༻͸೉ͦ͠͏
    • Best practices ܥͱ permissions ܥͷೋछྨ͕ࠞ
    ͍ͬͯ͟Δ͕ɼࠓޙͲ͏͍͏ํ޲ʹͳΔͷ͔
    • Best practices: oversized-images, etc.
    • Permissions: geolocations, fullscreen, etc.
    • ະରԠͷ৔߹͸ແࢹ͞ΕΔ͚ͩͳͷͰɼͱΓ͋͑
    ͣ report-only Ͱ༗ޮʹ͓ͯ͘͠ͷ͸͋Γ

    View full-size slide

  22. DISPNFEFWTVNNJUCSJFpOHTFTTJPO
    ॴײ
    • Reporting API
    • Reporting API Ͱ౷Ұ͢Δʹ͸ɼϢʔβʔϕʔε
    ʹ઎ΊΔΧόϨοδ͕ߴ·ͬͯर͑ΔΤϥʔ͸શ
    ͯ͜ͷ API Ͱ handling Ͱ͖ΔΑ͏ʹͳΔඞཁ͕
    ͋Δ
    • ීٴ཰͕ߴ·Βͳ͍ͱ࣮ઓʹ౤ೖ͢Δͷ͸ݫ͠
    ͍ʁ

    View full-size slide

  23. DISPNFEFWTVNNJUCSJFpOHTFTTJPO
    Sessions
    • Building Modern Web Media Experiences: Picture-in-
    Picture and AV1
    • Making Modern Web Content Discoverable for Search
    • Feature Policy & the Well-Lit Path for Web
    Development
    • virtual-scroller: Let there be less (DOM)
    • From Low Friction to Zero Friction with Web Packaging
    and Portals
    • State of Houdini
    • Building Engaging Immersive Experiences

    View full-size slide

  24. DISPNFEFWTVNNJUCSJFpOHTFTTJPO
    Sessions
    • Building Modern Web Media Experiences: Picture-in-
    Picture and AV1
    • Making Modern Web Content Discoverable for Search
    • Feature Policy & the Well-Lit Path for Web
    Development
    • virtual-scroller: Let there be less (DOM)
    • From Low Friction to Zero Friction with Web Packaging
    and Portals
    • State of Houdini
    • Building Engaging Immersive Experiences

    View full-size slide

  25. DISPNFEFWTVNNJUCSJFpOHTFTTJPO
    Virtual Scroll as a high-level API
    • Virtual Scroll
    • දࣔྖҬ֎ͷཁૉΛϨϯμ
    Ϧϯά͠ͳ͍Α͏ʹ͢Δ
    ʢvirtualisationʣ͜ͱͰύ
    ϑΥʔϚϯεΛߴΊΔ
    • ωΠςΟϒΞϓϦ΍ React/
    Vue/Angular ͷϑϨʔϜ
    ϫʔΫͰ͸Α͘࢖ΘΕ͍ͯ
    Δ

    View full-size slide

  26. DISPNFEFWTVNNJUCSJFpOHTFTTJPO
    طଘΞϓϩʔνͷ໰୊఺ͱରࡦ
    • ໰୊఺ɿӅΕ͍ͯΔ෦෼ʹؔͯ͠
    • ϦϯΫΛషΕͳ͍
    • ϖʔδ಺ݕࡧ͕Ͱ͖ͳ͍
    • SEO తʹ΋໰୊͕͋Δ
    • High-level API ͱͯ͠ϒϥ΢βͷ native ࣮૷Λ௥Ճ͢
    Δ͜ͱͰɼ্ه໰୊Λղܾ͢Δ
    • ύϑΥʔϚϯεʹ༏Ε࣮ͨ૷ΛϑϨʔϜϫʔΫબఆ
    ͳͲͳ͠ʹ؆୯ʹѻ͑ΔΑ͏ʹͳΔ

    View full-size slide

  27. DISPNFEFWTVNNJUCSJFpOHTFTTJPO
    "Layered API" ʹجͮ͘ࡦఆ
    • ଞϓϥοτϑΥʔϜͷ࣮૷΍ϑϨʔϜϫʔΫ͔ΒϢʔ
    εέʔεΛूΊɼաෆ଍ͳ͍ API ʹ·ͱΊΔ
    • ଞͷϒϥ΢βϕϯμɼϑϨʔϜϫʔΫ࡞ऀɼ։ൃ
    ऀ͔ΒώΞϦϯάͨ͠Γ GitHub Ͱٞ࿦ΛਂΊͨ
    Γͨ͠
    • low-level API Ͱ଍Γ͍ͯͳ͍΋ͷ͕͋Ε͹௥Ճ͢Δ
    • Invisible DOM
    • ͦͷ··Ͱे෼࢖͑ɼ͔֦ͭு΋Մೳͳ࢓༷Λࡦఆ

    View full-size slide

  28. DISPNFEFWTVNNJUCSJFpOHTFTTJPO
    ॴײ
    • high-level API ͕௥Ճ͞ΕΔ͜ͱ͸ૉ௚ʹخ͍͠
    • ن໛͕େ͖͘ͳͬͯ͘Δͱඞਢʹ͍ٕۙज़͕ native ࣮
    ૷͞ΕΔͷ͸େ͖͍ʢlazyload, virtualisation, etc...)
    • Google ͸ύϑΥʔϚϯεʹྗΛೖΕ͍ͯΔͷͰɼ͜͜
    Ͱͷਐาʹ͸ظ଴Ͱ͖ͦ͏
    • Layered APIs ϞσϧʹԊͬͯɼ޿͘ҙݟΛืΓͳ͕Βࡦ
    ఆ͍ͯ͠Δͷʹ҆৺ײ͕͋Δ
    • ͕͢͞ʹ high-level API ͷࡦఆʹ͸৻ॏʹͳ͍ͬͯΔ໛

    View full-size slide

  29. DISPNFEFWTVNNJUCSJFpOHTFTTJPO
    Sessions
    • Building Modern Web Media Experiences: Picture-in-
    Picture and AV1
    • Making Modern Web Content Discoverable for Search
    • Feature Policy & the Well-Lit Path for Web
    Development
    • virtual-scroller: Let there be less (DOM)
    • From Low Friction to Zero Friction with Web Packaging
    and Portals
    • State of Houdini
    • Building Engaging Immersive Experiences

    View full-size slide

  30. DISPNFEFWTVNNJUCSJFpOHTFTTJPO
    Sessions
    • Building Modern Web Media Experiences: Picture-in-
    Picture and AV1
    • Making Modern Web Content Discoverable for Search
    • Feature Policy & the Well-Lit Path for Web
    Development
    • virtual-scroller: Let there be less (DOM)
    • From Low Friction to Zero Friction with Web Packaging
    and Portals
    • State of Houdini
    • Building Engaging Immersive Experiences

    View full-size slide

  31. DISPNFEFWTVNNJUCSJFpOHTFTTJPO
    Web Packaging
    Signed Exchanges & Bundled Exchanges

    View full-size slide

  32. DISPNFEFWTVNNJUCSJFpOHTFTTJPO
    Web Packaging
    Signed Exchanges & Bundled Exchanges
    w63-͕഑৴ݩ PSJHJO
    ͷυϝΠϯʹͳΔ
    w".1CBS͕ඇදࣔʹͳΔ

    View full-size slide

  33. DISPNFEFWTVNNJUCSJFpOHTFTTJPO

    View full-size slide

  34. DISPNFEFWTVNNJUCSJFpOHTFTTJPO
    w".1͸(PPHMFͷαʔό͔Β഑৴͞ΕΔͨΊɼϒϥ΢β
    ͸PSJHJOͷ৘ใΛ͔֬ΊΔज़͕ͳ͘ɼΞυϨεόʔʹ
    (PPHMFͷυϝΠϯΛදࣔͤ͟ΔΛಘͳ͍
    wPSJHJOͷ৘ใΛॺ໊Ͱ༩͑Δ͜ͱͰɼϒϥ΢β͸PSJHJO
    ͷυϝΠϯΛΞυϨεόʔʹTFDVSFʹදࣔ͢Δ͜ͱ͕Մ
    ೳʹͳΔ

    View full-size slide

  35. DISPNFEFWTVNNJUCSJFpOHTFTTJPO
    Portals

    View full-size slide

  36. DISPNFEFWTVNNJUCSJFpOHTFTTJPO
    Portals
    wΫϩευϝΠϯͷભҠͰ͋ͬͯ΋ɼ41"ͷΑ͏ʹ׈Β͔
    ͳϖʔδભҠΛՄೳʹ͢Δٕज़
    wJGSBNFͱಉ͡Α͏ʹQPSUBMΛຒΊࠐΉ͜ͱͰ࢖༻
    Ͱ͖Δ

    View full-size slide

  37. DISPNFEFWTVNNJUCSJFpOHTFTTJPO
    ॴײ
    • Signed Exchange
    • AMP ରԠαΠτͰ͸ඞਢͷٕज़ͱͳ͍͖ͬͯͦ͏
    • Cloudflare ͕ AMP Packager ͱ͍͏αʔϏεΛग़͍ͯ͠
    ΔΑ͏ͳͷͰɼͦ͏ͨ͠ managed service Λ࢖͏ͷ΋Ұ
    ͭͷख͔
    • Portals
    • ϩάΠϯϖʔδ, ΩϟϯϖʔϯϖʔδͳͲυϝΠϯΛ෼͚
    Δ৔߹ʹ࢖͑ͦ͏
    • ڊେͳαΠτʹͯ JS ͷ entry point Λ෼͚ɼmicro
    frontend Խ͢Δͱ͖ʹ΋࢖͑Δ͔΋

    View full-size slide

  38. DISPNFEFWTVNNJUCSJFpOHTFTTJPO
    Sessions
    • Building Modern Web Media Experiences: Picture-in-
    Picture and AV1
    • Making Modern Web Content Discoverable for Search
    • Feature Policy & the Well-Lit Path for Web
    Development
    • virtual-scroller: Let there be less (DOM)
    • From Low Friction to Zero Friction with Web Packaging
    and Portals
    • State of Houdini
    • Building Engaging Immersive Experiences

    View full-size slide

  39. DISPNFEFWTVNNJUCSJFpOHTFTTJPO
    Sessions
    • Building Modern Web Media Experiences: Picture-in-
    Picture and AV1
    • Making Modern Web Content Discoverable for Search
    • Feature Policy & the Well-Lit Path for Web
    Development
    • virtual-scroller: Let there be less (DOM)
    • From Low Friction to Zero Friction with Web Packaging
    and Portals
    • State of Houdini
    • Building Engaging Immersive Experiences

    View full-size slide

  40. DISPNFEFWTVNNJUCSJFpOHTFTTJPO
    What is Houdini?
    • Style → Layout → Paint → Composite ͷ֤ϨϯμϦϯ
    άϓϩηεʹ hook ͯ͠ॲཧΛߦ͑Δٕज़
    • CSS ϓϩύςΟ, animation-timing-function, display
    value ͳͲΛಠࣗʹఆٛՄೳ
    • low-level / high-level API ͷ྆ํΛࡦఆத

    View full-size slide

  41. DISPNFEFWTVNNJUCSJFpOHTFTTJPO
    ར఺
    • Auto-repaint
    • Auto-sized
    • Off-the-main-thread
    • No DOM overhead

    View full-size slide

  42. DISPNFEFWTVNNJUCSJFpOHTFTTJPO
    ॴײ

    View full-size slide

  43. DISPNFEFWTVNNJUCSJFpOHTFTTJPO
    ॴײ
    • ࣮૷ঢ়گ͸ݫ͍͠
    • polyfill ΍ϑϨʔϜϫʔΫք۾Ͱ͸༗༻ͳٕज़ʹͳΔͷ
    Ͱ͸ͳ͍͔
    • ಛʹैདྷෆՄೳͩͬͨ CSS ͷ polyfill Λ࡞ΕΔΑ͏
    ʹͳΔ
    • ࣮຿ͰͷϢʔεέʔε͕͋Δ͔Ͳ͏͔͸...

    View full-size slide

  44. DISPNFEFWTVNNJUCSJFpOHTFTTJPO
    Sessions
    • Building Modern Web Media Experiences: Picture-in-
    Picture and AV1
    • Making Modern Web Content Discoverable for Search
    • Feature Policy & the Well-Lit Path for Web
    Development
    • virtual-scroller: Let there be less (DOM)
    • From Low Friction to Zero Friction with Web Packaging
    and Portals
    • State of Houdini
    • Building Engaging Immersive Experiences

    View full-size slide

  45. DISPNFEFWTVNNJUCSJFpOHTFTTJPO
    Sessions
    • Building Modern Web Media Experiences: Picture-in-
    Picture and AV1
    • Making Modern Web Content Discoverable for Search
    • Feature Policy & the Well-Lit Path for Web
    Development
    • virtual-scroller: Let there be less (DOM)
    • From Low Friction to Zero Friction with Web Packaging
    and Portals
    • State of Houdini
    • Building Engaging Immersive Experiences

    View full-size slide

  46. DISPNFEFWTVNNJUCSJFpOHTFTTJPO
    WebVR / WebXR Device API (for VR and AR)
    • Web ͸ install-free Ͱͦͷ৔Ͱ࢖͏͜ͱ͕Ͱ͖Δͷ͕
    େ͖ͳར఺
    • ಛʹ AR ͸ڭҭ, e-commerce ͳͲ

    ͷ෼໺Ͱ༗༻

    View full-size slide

  47. DISPNFEFWTVNNJUCSJFpOHTFTTJPO
    • polyfill Ͱ CardboardVR ΍ݹ͍ WebVR ޲͚ʹಈ͔͢
    ͜ͱ͕Մೳ
    • three.js ͱ૊Έ߹Θͤͯͷ։ൃ͕͓͢͢Ί
    • XRSession.requestHitTest (ࢹઢͱڥք໘ͱͷަ఺Λ
    ࢉग़Ͱ͖Δ API) ͳͲͱڠௐͤ͞ΒΕΔ
    • model-viewer ͱ͍͏ Web component ΋։ൃ͍ͯ͠Δ
    • 3D Programming ʹৄ͘͠ͳͯ͘΋࢖͑Δ

    View full-size slide

  48. DISPNFEFWTVNNJUCSJFpOHTFTTJPO
    ॴײ
    • ࣗ෼ͷपΓͰ͸ XR ≒ Unity engineer ͱ͍͏งғؾͳ
    ͷͰɼ Web ٕज़Ͱ࡞Δҙ͕ٛߴ·Ε͹ීٴͦ͠͏
    • install-free, interoperability, طଘαΠτͱͷ༥߹
    • install-free ͱ͍͏఺Ͱ͸ e-commerce ͱͷ਌࿨ੑ͸ߴ
    ͦ͏
    • ͋ͱ͸σόΠεͷීٴ࣍ୈʁ

    View full-size slide

  49. DISPNFEFWTVNNJUCSJFpOHTFTTJPO
    Wrapping Up

    View full-size slide

  50. DISPNFEFWTVNNJUCSJFpOHTFTTJPO
    • ৽͍͠ Web API ͷ঺հʹؔ͢Δηογϣϯͷ಺༰Λ
    ͬ͟ͱ঺հ
    • Progressive ʹ࢖͑ͦ͏ͳ΋ͷ / ֤ϒϥ΢βͷ࣮૷͕ਐ
    ·ͳ͍ͱ࢖͑ͳͦ͞͏ͳ΋ͷ
    • ݕ౼ͷ୺ॹʹͳΕ͹...
    • R.I.P Edge

    →Chrome νʔϜͷ API ࡦఆྗ͕໰ΘΕΔ࣌୅ʹ

    View full-size slide

  51. DISPNFEFWTVNNJUCSJFpOHTFTTJPO
    Thank you!

    View full-size slide