WebXR: Difference between revisions
Appearance
Xinreality (talk | contribs) No edit summary |
Xinreality (talk | contribs) No edit summary |
||
| Line 7: | Line 7: | ||
|Manufacturer=N/A | |Manufacturer=N/A | ||
|Operating System=Cross-platform | |Operating System=Cross-platform | ||
|Browser=[[Google Chrome]] 79+, [[Microsoft Edge]] 79+, [[Firefox]], [[Opera]] 66+, [[Samsung Internet]] 12+, [[Oculus Browser]], [[Safari]] (visionOS) | |Browser=[[Google Chrome]] 79+, [[Microsoft Edge]] 79+, [[Firefox]] (partial support), [[Opera]] 66+, [[Samsung Internet]] 12+, [[Oculus Browser]], [[Safari]] (visionOS) | ||
|Devices=[[VR headsets]], [[AR headsets]], [[AR-enabled smartphones]] | |Devices=[[VR headsets]], [[AR headsets]], [[AR-enabled smartphones]] | ||
|Accessories=[[Motion controllers]], [[Gamepads]], [[Hand tracking devices]] | |Accessories=[[Motion controllers]], [[Gamepads]], [[Hand tracking devices]] | ||
| Line 14: | Line 14: | ||
|Website=https://www.w3.org/TR/webxr/, https://immersiveweb.dev/, https://github.com/immersive-web/webxr/blob/master/explainer.md, https://developer.mozilla.org/en-US/docs/Web/API/WebXR_Device_API | |Website=https://www.w3.org/TR/webxr/, https://immersiveweb.dev/, https://github.com/immersive-web/webxr/blob/master/explainer.md, https://developer.mozilla.org/en-US/docs/Web/API/WebXR_Device_API | ||
}} | }} | ||
'''WebXR Device API''' (commonly known as '''WebXR''') is a [[Web API]] developed by the [[World Wide Web Consortium]] (W3C) that provides interfaces for accessing [[virtual reality]] (VR) and [[augmented reality]] (AR) devices on the web. WebXR enables developers to create immersive experiences that work across a wide range of [[hardware]] [[platforms]], including [[head-mounted display]]s, [[mobile AR devices]], and [[desktop environments]] with appropriate [[peripherals]]. | '''WebXR Device API''' (commonly known as '''WebXR''') is a [[Web API]] developed by the [[World Wide Web Consortium]] (W3C) that provides interfaces for accessing [[virtual reality]] (VR) and [[augmented reality]] (AR) devices on the web. WebXR enables developers to create immersive experiences that work across a wide range of [[hardware]] [[platforms]], including [[head-mounted display]]s, [[mobile AR devices]], and [[desktop environments]] with appropriate [[peripherals]]. | ||
The API allows web applications to detect compatible [[VR/AR devices]], query their capabilities, render 3D scenes to the devices at the appropriate [[frame rate]], and respond to [[input]] from associated controllers. WebXR represents an evolution from the earlier [[WebVR API]], expanding the scope to include augmented reality and other immersive technologies under the "[[XR]]" (Extended Reality) umbrella. | The API allows web applications to detect compatible [[VR/AR devices]], query their capabilities, render 3D scenes to the devices at the appropriate [[frame rate]], and respond to [[input]] from associated controllers. WebXR represents an evolution from the earlier [[WebVR API]], expanding the scope to include augmented reality and other immersive technologies under the "[[XR]]" (Extended Reality) umbrella. | ||
==History== | ==History== | ||
===WebVR: The Predecessor=== | ===WebVR: The Predecessor=== | ||
The development of WebXR began with its predecessor, [[WebVR]]. The WebVR API was first conceived in spring 2014 by Vladimir Vukićević from Mozilla. Key contributors to the early API included Brandon Jones from Google, Boris Smus, and other members of the Mozilla team. | The development of WebXR began with its predecessor, [[WebVR]]. The WebVR API was first conceived in spring 2014 by Vladimir Vukićević from Mozilla. Key contributors to the early API included Brandon Jones from Google, Boris Smus, and other members of the Mozilla team. | ||
On March 1, 2016, the Mozilla VR team and the Google Chrome team announced the WebVR 1.0 release. This early version of the API was implemented in Firefox and Chromium-based browsers, providing basic virtual reality functionality to web applications. | On March 1, 2016, the Mozilla VR team and the Google Chrome team announced the WebVR 1.0 release. This early version of the API was implemented in Firefox and Chromium-based browsers, providing basic virtual reality functionality to web applications. | ||
===Transition to WebXR=== | ===Transition to WebXR=== | ||
As the technology evolved, developers recognized the need for a more scalable and ergonomic API that would break backward compatibility with WebVR. Initially referred to as "WebVR 2.0," the new API was officially renamed WebXR to acknowledge its expanded scope that would include both VR and AR content. | As the technology evolved, developers recognized the need for a more scalable and ergonomic API that would break backward compatibility with WebVR. Initially referred to as "WebVR 2.0," the new API was officially renamed WebXR to acknowledge its expanded scope that would include both VR and AR content. | ||
The transition benefited from: | The transition benefited from: | ||
| Line 33: | Line 33: | ||
* Multiple mature native APIs to draw inspiration from | * Multiple mature native APIs to draw inspiration from | ||
On September 24, 2018, the Immersive Web Working Group became official, formalizing the development process for WebXR standards. | On September 24, 2018, the Immersive Web Working Group became official, formalizing the development process for WebXR standards. WebXR was designed to completely replace WebVR, with all browsers that initially shipped WebVR committing to adopt WebXR once the API design was finalized. | ||
===Recent Developments=== | ===Recent Developments=== | ||
The WebXR standard continues to evolve, with the | The WebXR standard continues to evolve, with the WebXR Device API advancing through the W3C standardization process as a Candidate Recommendation. The editors of the specification come from major technology companies including [[Google]] and [[Meta]], with additional input from [[Mozilla]], [[Microsoft]], [[Samsung]] Electronics, [[Apple]], as well as various startups and invited experts. | ||
In 2023, a significant milestone was reached when Apple announced WebXR support for its visionOS platform, which powers the Apple Vision Pro mixed reality headset. Initially, WebXR support in Safari for visionOS was available behind a feature flag while Apple collaborated with the W3C Immersive Web Working Group. | |||
By early 2024, Apple expanded WebXR capabilities by adding support for the headset's natural input methods. In March 2024, visionOS 1.1 introduced support for gaze-and-pinch interactions in WebXR experiences, with Apple contributing a new "transient-pointer" input mode to the WebXR standard to accommodate these interactions. | |||
With the announcement of visionOS 2 in mid-2024, Apple further committed to WebXR by making it enabled by default in Safari, eliminating the need for users to enable experimental feature flags. However, as of May 2025, WebXR on visionOS still only supports the immersive-vr session type, with the immersive-ar mode still in development. | |||
Ongoing efforts in the standard focus on improving performance, enhancing device compatibility, refining input methods, and expanding AR capabilities across platforms. | |||
==Technical Overview== | ==Technical Overview== | ||
| Line 46: | Line 52: | ||
* '''inline''' - Renders XR content within an HTML element on a web page | * '''inline''' - Renders XR content within an HTML element on a web page | ||
* '''immersive-vr''' - Provides an exclusive, fully [[immersive VR]] experience | * '''immersive-vr''' - Provides an exclusive, fully [[immersive VR]] experience | ||
* '''immersive-ar''' - Blends virtual content with the real world environment | * '''immersive-ar''' - Blends virtual content with the real world environment | ||
====Reference Spaces==== | ====Reference Spaces==== | ||
| Line 54: | Line 60: | ||
* '''local-floor''' - Like local, but with Y=0 at floor level | * '''local-floor''' - Like local, but with Y=0 at floor level | ||
* '''bounded-floor''' - A floor-relative space with defined boundaries | * '''bounded-floor''' - A floor-relative space with defined boundaries | ||
* '''unbounded''' - A space for world-scale AR experiences | * '''unbounded''' - A space for world-scale AR experiences | ||
====Rendering Process==== | ====Rendering Process==== | ||
| Line 62: | Line 68: | ||
#Delivering the combined framebuffer to the XR device for display | #Delivering the combined framebuffer to the XR device for display | ||
The API handles the complex timing and scheduling required for comfortable XR experiences, but does not directly manage 3D assets or perform rendering—that responsibility falls to WebGL or other graphics libraries. | The API handles the complex timing and scheduling required for comfortable XR experiences, but does not directly manage 3D assets or perform rendering—that responsibility falls to WebGL or other graphics libraries. | ||
====Input Handling==== | ====Input Handling==== | ||
| Line 69: | Line 75: | ||
* Hand tracking | * Hand tracking | ||
* Gaze-based input methods | * Gaze-based input methods | ||
* Session-specific events (select, squeeze, etc.) | * Natural input interactions (such as gaze-and-pinch on Apple Vision Pro) | ||
* Session-specific events (select, squeeze, etc.) | |||
===API Architecture=== | ===API Architecture=== | ||
| Line 107: | Line 114: | ||
====Core Module==== | ====Core Module==== | ||
* '''[[WebXR Device API]]''' - Provides basic session management, device detection, and rendering capabilities | * '''[[WebXR Device API]]''' - Provides basic session management, device detection, and rendering capabilities | ||
====Extension Modules==== | ====Extension Modules==== | ||
* '''WebXR AR Module''' - Adds augmented reality support through the "immersive-ar" session mode | * '''WebXR AR Module''' - Adds augmented reality support through the "immersive-ar" session mode | ||
* '''WebXR Gamepads Module''' - Provides interfaces for button, trigger, thumbstick, and touchpad input | * '''WebXR Gamepads Module''' - Provides interfaces for button, trigger, thumbstick, and touchpad input | ||
* '''WebXR Hand Input Module''' - Enables hand tracking functionality | * '''WebXR Hand Input Module''' - Enables hand tracking functionality | ||
* '''WebXR Layers Module''' - Supports rendering to multiple composited layers | * '''WebXR Layers Module''' - Supports rendering to multiple composited layers | ||
* '''WebXR Lighting Estimation Module''' - Allows AR applications to match virtual lighting with real-world conditions | * '''WebXR Lighting Estimation Module''' - Allows AR applications to match virtual lighting with real-world conditions | ||
* '''WebXR DOM Overlay Module''' - Enables overlaying HTML content in immersive AR sessions | |||
* '''WebXR Anchors Module''' - Provides spatial anchoring capabilities for persistent AR experiences | |||
This modular approach allows the WebXR standard to evolve and expand while maintaining compatibility with existing implementations. | This modular approach allows the WebXR standard to evolve and expand while maintaining compatibility with existing implementations. | ||
| Line 149: | Line 158: | ||
| [[Oculus Browser]] | | [[Oculus Browser]] | ||
| | | | ||
| For | | For Meta Quest devices | ||
|- | |- | ||
| [[Safari]] | | [[Safari]] | ||
| Line 156: | Line 165: | ||
|} | |} | ||
Safari on iOS | Firefox provides partial WebXR support with ongoing development to expand capabilities. Safari on iOS does not support WebXR, but Safari on visionOS for Apple Vision Pro does support WebXR, with full immersive-vr mode support in visionOS 2 (enabled by default) and experimental work on immersive-ar mode in development. | ||
===Hardware Compatibility=== | ===Hardware Compatibility=== | ||
| Line 164: | Line 173: | ||
====VR Devices==== | ====VR Devices==== | ||
*[[Tethered headsets]] ([[HTC Vive]], [[Oculus Rift]], etc.) | *[[Tethered headsets]] ([[HTC Vive]], [[Oculus Rift]], etc.) | ||
*[[Standalone headsets]] ([[Meta Quest]], [[HTC Vive Focus]], etc.) | *[[Standalone headsets]] ([[Meta Quest]], [[HTC Vive Focus]], [[Apple Vision Pro]], etc.) | ||
*[[Mobile VR]] solutions ([[Google Cardboard]], etc.) | *[[Mobile VR]] solutions ([[Google Cardboard]], etc.) | ||
| Line 170: | Line 179: | ||
*[[AR headsets]] ([[Microsoft HoloLens]], [[Magic Leap]], [[Apple Vision Pro]]) | *[[AR headsets]] ([[Microsoft HoloLens]], [[Magic Leap]], [[Apple Vision Pro]]) | ||
*[[Mobile AR]] ([[ARCore]] on [[Android]], [[ARKit]] on [[iOS]]) | *[[Mobile AR]] ([[ARCore]] on [[Android]], [[ARKit]] on [[iOS]]) | ||
*Video [[passthrough]] devices | *Video [[passthrough]] devices | ||
===Input Mechanisms=== | |||
WebXR supports various input methods based on device capabilities: | |||
* **Physical Controllers**: Traditional VR motion controllers with buttons, triggers, and thumbsticks | |||
* **Hand Tracking**: Natural hand movements and gestures | |||
* **Gaze-Based**: Targeting objects by looking at them | |||
* **Platform-Specific**: Such as Apple Vision Pro's gaze-and-pinch interaction system | |||
* **Hybrid Approaches**: Combinations of the above methods | |||
The "transient-pointer" input mode, introduced in 2024, enables more natural and privacy-preserving interaction methods that don't rely on persistent controller data. | |||
===Feature Detection and Fallbacks=== | ===Feature Detection and Fallbacks=== | ||
| Line 177: | Line 197: | ||
* Feature detection to check if WebXR is supported in the current browser | * Feature detection to check if WebXR is supported in the current browser | ||
* The WebXR Polyfill that provides a fallback implementation for browsers without native support | * The WebXR Polyfill that provides a fallback implementation for browsers without native support | ||
* The WebXR API Emulator, a browser extension that simulates XR hardware for development and testing | * The WebXR API Emulator, a browser extension that simulates XR hardware for development and testing | ||
===Security Requirements=== | ===Security Requirements=== | ||
| Line 184: | Line 204: | ||
* WebXR applications must be served over HTTPS or from localhost | * WebXR applications must be served over HTTPS or from localhost | ||
* Permission is required from the user before accessing XR devices | * Permission is required from the user before accessing XR devices | ||
* Additional user consent is required for features that access real-world information (like camera frames) | * Additional user consent is required for features that access real-world information (like camera frames) | ||
==Use Cases== | ==Use Cases== | ||
| Line 192: | Line 212: | ||
*'''Virtual Tours''' - Museum exhibits, property showcases, and travel destinations | *'''Virtual Tours''' - Museum exhibits, property showcases, and travel destinations | ||
*'''[[Social VR]]''' - Virtual meeting spaces, collaborative environments, and social platforms | *'''[[Social VR]]''' - Virtual meeting spaces, collaborative environments, and social platforms | ||
*'''[[Therapeutic Application]]''' - Exposure therapy, pain management, and rehabilitation | *'''[[Therapeutic Application]]''' - Exposure therapy, pain management, and rehabilitation | ||
===Augmented Reality Applications=== | ===Augmented Reality Applications=== | ||
| Line 199: | Line 219: | ||
*'''Navigation''' - Enhanced wayfinding, points of interest, and information overlays | *'''Navigation''' - Enhanced wayfinding, points of interest, and information overlays | ||
*'''[[Art]] and [[Culture]]''' - Interactive exhibits, enhanced performances, and public installations | *'''[[Art]] and [[Culture]]''' - Interactive exhibits, enhanced performances, and public installations | ||
*'''[[Education]]''' - Interactive learning materials, visualizations, and simulations | *'''[[Education]]''' - Interactive learning materials, visualizations, and simulations | ||
===Cross-Reality Experiences=== | ===Cross-Reality Experiences=== | ||
| Line 206: | Line 226: | ||
* Applications that adapt between VR and AR depending on available hardware | * Applications that adapt between VR and AR depending on available hardware | ||
* Collaborative experiences where some users are in VR and others in AR | * Collaborative experiences where some users are in VR and others in AR | ||
* Progressive experiences that start in 2D and can transition to immersive modes | * Progressive experiences that start in 2D and can transition to immersive modes | ||
==Development Tools and Frameworks== | ==Development Tools and Frameworks== | ||
| Line 223: | Line 243: | ||
* '''[[WebXR Polyfill]]''' - JavaScript implementation for browsers without native support | * '''[[WebXR Polyfill]]''' - JavaScript implementation for browsers without native support | ||
* '''[[Mozilla WebXR Viewer]]''' - Experimental iOS app for testing WebXR content | * '''[[Mozilla WebXR Viewer]]''' - Experimental iOS app for testing WebXR content | ||
* '''[[WebXR Input Profiles]]''' - Repository of controller models and binding information | * '''[[WebXR Input Profiles]]''' - Repository of controller models and binding information | ||
==Advantages and Limitations== | ==Advantages and Limitations== | ||
| Line 232: | Line 252: | ||
*'''Instant updates''' - Changes deployed immediately without app store approval | *'''Instant updates''' - Changes deployed immediately without app store approval | ||
*'''Progressive enhancement''' - Can adapt to available hardware capabilities | *'''Progressive enhancement''' - Can adapt to available hardware capabilities | ||
*'''Integration with web ecosystem''' - Works with existing web technologies and services | *'''Integration with web ecosystem''' - Works with existing web technologies and services | ||
===Limitations=== | ===Limitations=== | ||
| Line 276: | Line 296: | ||
|} | |} | ||
While WebXR has similarities to native APIs like OpenXR, ARCore, and ARKit, it provides a more accessible cross-platform alternative with some performance and feature tradeoffs. | While WebXR has similarities to native APIs like OpenXR, ARCore, and ARKit, it provides a more accessible cross-platform alternative with some performance and feature tradeoffs. | ||
==The Future of WebXR== | ==The Future of WebXR== | ||
| Line 289: | Line 309: | ||
*'''[[Haptic feedback]]''' - More sophisticated tactile responses | *'''[[Haptic feedback]]''' - More sophisticated tactile responses | ||
*'''Integration with other web APIs''' - Working with geolocation, WebAudio, etc. | *'''Integration with other web APIs''' - Working with geolocation, WebAudio, etc. | ||
*'''Platform-specific interactions''' - Standardizing support for diverse input methods | |||
*'''Spatial computing features''' - Supporting advanced room-scale experiences | |||
===Adoption Trends=== | ===Adoption Trends=== | ||
| Line 297: | Line 319: | ||
*'''Enterprise training''' solutions are utilizing WebXR for cost-effective simulations | *'''Enterprise training''' solutions are utilizing WebXR for cost-effective simulations | ||
*'''Social platforms''' are exploring WebXR for shared experiences | *'''Social platforms''' are exploring WebXR for shared experiences | ||
*'''Mixed reality headsets''' like Apple Vision Pro are embracing WebXR standards | |||
===Challenges=== | ===Challenges=== | ||
| Line 306: | Line 329: | ||
*'''Development complexity''' - For sophisticated experiences | *'''Development complexity''' - For sophisticated experiences | ||
*'''User awareness''' - Many users are unfamiliar with web-based XR | *'''User awareness''' - Many users are unfamiliar with web-based XR | ||
*'''Platform-specific implementations''' - Differences in implementation across vendors | |||
==References== | ==References== | ||
<references> | <references> | ||
<ref name="w3c-webxr">World Wide Web Consortium. ( | <ref name="w3c-webxr">World Wide Web Consortium. (2023). WebXR Device API. W3C. Retrieved May 6, 2025, from https://www.w3.org/TR/webxr/</ref> | ||
<ref name="mdn-webxr">Mozilla Developer Network. (2025, April 4). WebXR Device API. MDN Web Docs. Retrieved May 6, 2025, from https://developer.mozilla.org/en-US/docs/Web/API/WebXR_Device_API</ref> | <ref name="mdn-webxr">Mozilla Developer Network. (2025, April 4). WebXR Device API. MDN Web Docs. Retrieved May 6, 2025, from https://developer.mozilla.org/en-US/docs/Web/API/WebXR_Device_API</ref> | ||
<ref name="webxr-wiki">Wikipedia. (2025, April). WebXR. Retrieved May 6, 2025, from https://en.wikipedia.org/wiki/WebXR</ref> | <ref name="webxr-wiki">Wikipedia. (2025, April). WebXR. Retrieved May 6, 2025, from https://en.wikipedia.org/wiki/WebXR</ref> | ||
<ref name="webxr-explained">Immersive Web Working Group. ( | <ref name="webxr-explained">Immersive Web Working Group. (2024). WebXR Device API Explained. Retrieved May 6, 2025, from https://immersive-web.github.io/webxr/explainer.html</ref> | ||
<ref name=" | <ref name="immersiveweb-community">Immersive Web Community Group. (2024). About the Immersive Web Community Group. Retrieved May 6, 2025, from https://www.w3.org/community/immersive-web/</ref> | ||
<ref name="w3c-ar-module">World Wide Web Consortium. ( | <ref name="w3c-ar-module">World Wide Web Consortium. (2023). WebXR Augmented Reality Module - Level 1. W3C. Retrieved May 6, 2025, from https://www.w3.org/TR/webxr-ar-module-1/</ref> | ||
<ref name="mdn-fundamentals">Mozilla Developer Network. (2023, February 19). Fundamentals of WebXR. MDN Web Docs. Retrieved May 6, 2025, from https://developer.mozilla.org/en-US/docs/Web/API/WebXR_Device_API/Fundamentals</ref> | <ref name="mdn-fundamentals">Mozilla Developer Network. (2023, February 19). Fundamentals of WebXR. MDN Web Docs. Retrieved May 6, 2025, from https://developer.mozilla.org/en-US/docs/Web/API/WebXR_Device_API/Fundamentals</ref> | ||
<ref name="webxr-gamepads">Immersive Web Working Group. ( | <ref name="webxr-gamepads">Immersive Web Working Group. (2023). WebXR Gamepads Module - Level 1. Retrieved May 6, 2025, from https://immersive-web.github.io/webxr-gamepads-module/</ref> | ||
<ref name="w3c-lighting">World Wide Web Consortium. ( | <ref name="w3c-lighting">World Wide Web Consortium. (2023). WebXR Lighting Estimation API Level 1. W3C. Retrieved May 6, 2025, from https://www.w3.org/TR/webxr-lighting-estimation-1/</ref> | ||
<ref name=" | <ref name="caniuse-webxr">Can I use. (2025, May). WebXR Device API. Retrieved May 6, 2025, from https://caniuse.com/webxr</ref> | ||
<ref name="immersiveweb">Immersive Web. ( | <ref name="immersiveweb">Immersive Web. (2025). Immersive Web Developer Home. Retrieved May 6, 2025, from https://immersiveweb.dev/</ref> | ||
<ref name="mdn-startup">Mozilla Developer Network. ( | <ref name="mdn-startup">Mozilla Developer Network. (2023). Starting up and shutting down a WebXR session. MDN Web Docs. Retrieved May 6, 2025, from https://developer.mozilla.org/en-US/docs/Web/API/WebXR_Device_API/Startup_and_shutdown</ref> | ||
<ref name="google-webxr">Google Developers. (2024 | <ref name="google-webxr">Google Developers. (2024). WebXR | ARCore. Retrieved May 6, 2025, from https://developers.google.com/ar/develop/webxr</ref> | ||
<ref name="apple-visionos-webxr">Apple Developer. (2024, June). WebXR for visionOS. Retrieved May 6, 2025, from https://developer.apple.com/documentation/webkit/webxr_for_visionos</ref> | |||
<ref name="webkit-webxr-blog">WebKit Blog. (2024, March). Natural Input for WebXR on visionOS. Retrieved May 6, 2025, from https://webkit.org/blog/14142/natural-input-for-webxr-on-visionos/</ref> | |||
</references> | </references> | ||