WebXR Device API

Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

WebXR is a group of standards which are used together to support rendering 3D scenes to hardware designed for presenting virtual worlds (virtual reality, or VR), or for adding graphical imagery to the real world, (augmented reality, or AR). The WebXR Device API implements the core of the WebXR feature set, managing the selection of output devices, render the 3D scene to the chosen device at the appropriate frame rate, and manage motion vectors created using input controllers.

WebXR-compatible devices include fully-immersive 3D headsets with motion and orientation tracking, eyeglasses which overlay graphics atop the real world scene passing through the frames, and handheld mobile phones which augment reality by capturing the world with a camera and augment that scene with computer-generated imagery.

To accomplish these things, the WebXR Device API provides the following key capabilities:

Find compatible VR or AR output devices
Render a 3D scene to the device at an appropriate frame rate
(Optionally) mirror the output to a 2D display
Create vectors representing the movements of input controls

At the most basic level, a scene is presented in 3D by computing the perspective to apply to the scene in order to render it from the viewpoint of each of the user's eyes by computing the position of each eye and rendering the scene from that position, looking in the direction the user is currently facing. Each of these two images is rendered into a single framebuffer, with the left eye's rendered image on the left and the right eye's viewpoint rendered into the right half of the buffer. Once both eyes' perspectives on the scene have been rendered, the resulting framebuffer is delivered to the WebXR device to be presented to the user through their headset or other appropriate display device.

While the older WebVR API was designed solely to support Virtual Reality (VR), WebXR provides support for both VR and Augmented Reality (AR) on the web. Support for AR functionality is added by the WebXR Augmented Reality Module.

A typical XR device can have either 3 or 6 degrees of freedom and might or might not have an external positional sensor.

The equipment may also include an accelerometer, barometer, or other sensors which are used to sense when the user moves through space, rotates their head, or the like.

WebXR reference docs

Initialization

Session

Frame loop

XRFrame

Spaces

Views

Geometric primitives

XRRigidTransform

Pose

Input

Layers

WebGL binding

Anchors

Depth sensing

Hit testing

Lighting estimation

Guides and tutorials

The following guides and tutorials are a great resource to learn how to comprehend WebXR and the underlying 3D and VR/AR graphics concepts.

Foundations and basics

Creating a mixed reality experience

Making it interactive

Performance and security

Specifications

Specification
WebXR Device API (Source, Issues, Explainer)
WebXR Anchors Module (Source, Issues, Explainer)
WebXR Augmented Reality Module (Source, Issues, Explainer)
WebXR Depth Sensing Module (Source, Issues, Explainer)
WebXR DOM Overlays Module (Source, Issues, Explainer)
WebXR Gamepads Module (Source, Issues, Explainer)
WebXR Hand Input Module (Source, Issues, Explainer)
WebXR Hit Test Module (Source, Issues, Explainer)
WebXR Layers API (Source, Issues, Explainer)
WebXR Lighting Estimation API (Source, Issues, Explainer)

Browser compatibility

	Desktop						Mobile
	Chrome	Edge	Firefox	Internet Explorer	Opera	Safari	WebView Android	Chrome Android	Firefox for Android	Opera Android	Safari on IOS	Samsung Internet
`WebXR_Device_API`	79	79	No	No	No	No	No	79	No	No	No	11.2