recursal/MDN huggingface dataset:
VRFrameData: rightViewMatrix property
=====================================

**Deprecated:** This feature is no longer recommended. Though some browsers might still support it, it may have already been removed from the relevant web standards, may be in the process of being dropped, or may only be kept for compatibility purposes. Avoid using it, and update existing code if possible; see the compatibility table at the bottom of this page to guide your decision. Be aware that this feature may cease to work at any time.

**Non-standard:** This feature is non-standard and is not on a standards track. Do not use it on production sites facing the Web: it will not work for every user. There may also be large incompatibilities between implementations and the behavior may change in the future.

The **`rightViewMatrix`** read-only property of the `VRFrameData` interface returns a `Float32Array` representing a 4x4 matrix that describes the view transform to be used for the right eye's rendering.

**Note:** This property was part of the old WebVR API. It has been superseded by the WebXR Device API.

This value may be passed directly to WebGL's `uniformMatrix4fv` function.

**Warning:** It is highly recommended that applications use this matrix when rendering.

Value
-----

A `Float32Array` object.

Examples
--------

See `VRDisplay.getFrameData()` for example code.

Specifications
--------------

This property was part of the old WebVR API that has been superseded by the WebXR Device API. It is no longer on track to becoming a standard.

Until all browsers have implemented the new WebXR APIs, it is recommended to rely on frameworks, like A-Frame, Babylon.js, or Three.js, or a polyfill, to develop WebXR applications that will work across all browsers [1].

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

See also
--------

* WebVR API
VRFrameData: VRFrameData() constructor
======================================

**Deprecated:** This feature is no longer recommended. Though some browsers might still support it, it may have already been removed from the relevant web standards, may be in the process of being dropped, or may only be kept for compatibility purposes. Avoid using it, and update existing code if possible; see the compatibility table at the bottom of this page to guide your decision. Be aware that this feature may cease to work at any time.

**Non-standard:** This feature is non-standard and is not on a standards track. Do not use it on production sites facing the Web: it will not work for every user. There may also be large incompatibilities between implementations and the behavior may change in the future.

The **`VRFrameData()`** constructor creates a `VRFrameData` object instance.

**Note:** This constructor was part of the old WebVR API. It has been superseded by the WebXR Device API.

Syntax
------


```js
new VRFrameData()
```

### Parameters

None.

Examples
--------

See `VRDisplay.getFrameData()` for example code.

Specifications
--------------

This constructor was part of the old WebVR API that has been superseded by the WebXR Device API. It is no longer on track to becoming a standard.

Until all browsers have implemented the new WebXR APIs, it is recommended to rely on frameworks, like A-Frame, Babylon.js, or Three.js, or a polyfill, to develop WebXR applications that will work across all browsers [1].

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

See also
--------

* WebVR API
VRFrameData: pose property
==========================

**Deprecated:** This feature is no longer recommended. Though some browsers might still support it, it may have already been removed from the relevant web standards, may be in the process of being dropped, or may only be kept for compatibility purposes. Avoid using it, and update existing code if possible; see the compatibility table at the bottom of this page to guide your decision. Be aware that this feature may cease to work at any time.

**Non-standard:** This feature is non-standard and is not on a standards track. Do not use it on production sites facing the Web: it will not work for every user. There may also be large incompatibilities between implementations and the behavior may change in the future.

The **`pose`** read-only property of the `VRFrameData` interface returns the `VRPose` of the `VRDisplay` at the current `VRFrameData.timestamp`.

**Note:** This property was part of the old WebVR API. It has been superseded by the WebXR Device API.

Value
-----

A `VRPose` object.

Examples
--------

See `VRDisplay.getFrameData()` for example code.

Specifications
--------------

This property was part of the old WebVR API that has been superseded by the WebXR Device API. It is no longer on track to becoming a standard.

Until all browsers have implemented the new WebXR APIs, it is recommended to rely on frameworks, like A-Frame, Babylon.js, or Three.js, or a polyfill, to develop WebXR applications that will work across all browsers [1].

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

See also
--------

* WebVR API
VRFrameData: rightProjectionMatrix property
===========================================

**Deprecated:** This feature is no longer recommended. Though some browsers might still support it, it may have already been removed from the relevant web standards, may be in the process of being dropped, or may only be kept for compatibility purposes. Avoid using it, and update existing code if possible; see the compatibility table at the bottom of this page to guide your decision. Be aware that this feature may cease to work at any time.

**Non-standard:** This feature is non-standard and is not on a standards track. Do not use it on production sites facing the Web: it will not work for every user. There may also be large incompatibilities between implementations and the behavior may change in the future.

The **`rightProjectionMatrix`** read-only property of the `VRFrameData` interface returns a `Float32Array` representing a 4x4 matrix that describes the projection to be used for the right eye's rendering.

**Note:** This property was part of the old WebVR API. It has been superseded by the WebXR Device API.

This value may be passed directly to WebGL's `uniformMatrix4fv` function.

**Warning:** It is highly recommended that applications use this matrix without modification. Failure to use this projection matrix when rendering may cause the presented frame to be distorted or badly aligned, resulting in varying degrees of user discomfort.

Value
-----

A `Float32Array` object.

Examples
--------

See `VRDisplay.getFrameData()` for example code.

Specifications
--------------

This property was part of the old WebVR API that has been superseded by the WebXR Device API. It is no longer on track to becoming a standard.

Until all browsers have implemented the new WebXR APIs, it is recommended to rely on frameworks, like A-Frame, Babylon.js, or Three.js, or a polyfill, to develop WebXR applications that will work across all browsers [1].

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

See also
--------

* WebVR API
OffscreenCanvas: convertToBlob() method
=======================================

Baseline 2023
-------------

Newly availableSince March 2023, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers.

* Learn more
* See full compatibility
* Report feedback
The **`OffscreenCanvas.convertToBlob()`** method creates a `Blob` object representing the image contained in the canvas.

 The desired file format and image quality may be specified.
 If the file format is not specified, or if the given format is not supported, then the data will be exported as `image/png`.
 Browsers are required to support `image/png`; many will support additional formats including `image/jpeg` and `image/webp`.

The created image will have a resolution of 96dpi for file formats that support encoding resolution metadata.

Syntax
------


```js
convertToBlob()
convertToBlob(options)
```

### Parameters

`options` Optional

An object with the following properties:

`type`

 A string indicating the image format.
 The default type is `image/png`; this image format will be also used if the specified type is not supported.


`quality`

 A `Number` between `0` and `1` indicating the image quality to be used when creating images using file formats that support lossy compression (such as `image/jpeg` or `image/webp`).
 A user agent will use its default quality value if this option is not specified, or if the number is outside the allowed range.



### Return value

A `Promise` returning a `Blob` object representing the image contained in the canvas.

### Exceptions

The promise may be rejected with the following exceptions:

`InvalidStateError` `DOMException`

The `OffscreenCanvas` is not detached; in other words it still associated with the DOM and not the current worker.

`SecurityError` `DOMException`

The canvas context mode is 2d and the bitmap is not origin-clean; at least some of its contents have or may have been loaded from a site other than the one from which the document itself was loaded.

`IndexSizeError` `DOMException`

The canvas bitmap has no pixels (either the horizontal or vertical dimension is zero).

`EncodingError` `DOMException`

The blob could not be created due to an encoding error.

Examples
--------


```js
const offscreen = new OffscreenCanvas(256, 256);
const gl = offscreen.getContext("webgl");

// Perform some drawing using the gl context

offscreen.convertToBlob().then((blob) => console.log(blob));
// Blob { size: 334, type: "image/png" }
```

Specifications
--------------

| Specification |
| --- |
| HTML Standard # dom-offscreencanvas-converttoblob-dev |

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

See also
--------

* The interface defining this method, `OffscreenCanvas`.
OffscreenCanvas: width property
===============================

Baseline 2023
-------------

Newly availableSince March 2023, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers.

* Learn more
* See full compatibility
* Report feedback
The **`width`** property returns and sets the width of an `OffscreenCanvas` object.

Value
-----

Examples
--------

Creating a new offscreen canvas and returning or setting the width of the offscreen canvas:


```js
const offscreen = new OffscreenCanvas(256, 256);
offscreen.width; // 256
offscreen.width = 512;
```

Specifications
--------------

| Specification |
| --- |
| HTML Standard # dom-offscreencanvas-width-dev |

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

See also
--------

* `OffscreenCanvas`, the interface this property belongs to.
OffscreenCanvas: OffscreenCanvas() constructor
==============================================

Baseline 2023
-------------

Newly availableSince March 2023, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers.

* Learn more
* See full compatibility
* Report feedback
The **`OffscreenCanvas()`** constructor returns a newly instantiated `OffscreenCanvas` object.

Syntax
------


```js
new OffscreenCanvas(width, height)
```

### Parameters

`width`

The width of the offscreen canvas.

`height`

The height of the offscreen canvas.

Examples
--------

 This example creates a new offscreen canvas using the `OffscreenCanvas()` constructor.
 We then initialize a WebGL context on it using the `getContext()` method.


```js
const offscreen = new OffscreenCanvas(256, 256);
const gl = offscreen.getContext("webgl");
```

Specifications
--------------

| Specification |
| --- |
| HTML Standard # dom-offscreencanvas-dev |

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

See also
--------

* `OffscreenCanvas`, the interface this constructor belongs to
OffscreenCanvas: transferToImageBitmap() method
===============================================

Baseline 2023
-------------

Newly availableSince March 2023, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers.

* Learn more
* See full compatibility
* Report feedback
The **`OffscreenCanvas.transferToImageBitmap()`** method creates an `ImageBitmap` object from the most recently rendered image of the `OffscreenCanvas`. The `OffscreenCanvas` allocates a new image for its subsequent rendering.

Syntax
------


```js
transferToImageBitmap()
```

### Parameters

None.

### Return value

A newly-allocated `ImageBitmap`.

This `ImageBitmap` references a potentially large graphics resource, and to ensure your web application remains robust, it is important to avoid allocating too many of these resources at any point in time. For this reason it is important to ensure that the `ImageBitmap` is either *consumed* or *closed*.

As described in the `OffscreenCanvas` examples, passing this `ImageBitmap` to `ImageBitmapRenderingContext.transferFromImageBitmap()` *consumes* the `ImageBitmap` object; it no longer references the underlying graphics resource, and can not be passed to any other web APIs.

If your goal is to pass the `ImageBitmap` to other web APIs which do not consume it - for example, `CanvasRenderingContext2D.drawImage()` - then you should *close* it when you're done with it by calling `ImageBitmap.close()`. Don't simply drop the JavaScript reference to the `ImageBitmap`; doing so will keep its graphics resource alive until the next time the garbage collector runs.

If you call `transferToImageBitmap()` and don't intend to pass it to `ImageBitmapRenderingContext.transferFromImageBitmap()`, consider whether you need to call `transferToImageBitmap()` at all. Many web APIs which accept `ImageBitmap` also accept `OffscreenCanvas` as an argument.

Examples
--------


```js
const offscreen = new OffscreenCanvas(256, 256);
const gl = offscreen.getContext("webgl");

// Perform some drawing using the gl context

offscreen.transferToImageBitmap();
// ImageBitmap { width: 256, height: 256 }

// Either:
// Pass this `ImageBitmap` to `ImageBitmapRenderingContext.transferFromImageBitmap`
// or:
// Use the `ImageBitmap` with other web APIs, and call `ImageBitmap.close()`!
```

Specifications
--------------

| Specification |
| --- |
| HTML Standard # dom-offscreencanvas-transfertoimagebitmap-dev |

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

See also
--------

* The interface defining this method, `OffscreenCanvas`
* `ImageBitmapRenderingContext.transferFromImageBitmap`
OffscreenCanvas: height property
================================

Baseline 2023
-------------

Newly availableSince March 2023, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers.

* Learn more
* See full compatibility
* Report feedback
The **`height`** property returns and sets the height of an `OffscreenCanvas` object.

Value
-----

Examples
--------

Creating a new offscreen canvas and returning or setting the height of the offscreen canvas:


```js
const offscreen = new OffscreenCanvas(256, 256);
offscreen.height; // 256
offscreen.height = 512;
```

Specifications
--------------

| Specification |
| --- |
| HTML Standard # dom-offscreencanvas-height-dev |

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

See also
--------

* `OffscreenCanvas`, the interface this property belongs to.
TimeRanges: length property
===========================

 The **`TimeRanges.length`** read-only property returns the
 number of ranges in the object.

Value
-----

A number.

Examples
--------

Given a video element with the ID "myVideo":


```js
const v = document.getElementById("myVideo");

const buf = v.buffered;

const numRanges = buf.length;

if (buf.length === 1) {
  // Only one range
  if (buf.start(0) === 0 && buf.end(0) === v.duration) {
    // The one range starts at the beginning and ends at
    // the end of the video, so the whole thing is loaded
  }
}
```


 This example looks at the time ranges and looks to see if the entire video has been
 loaded.

Specifications
--------------

| Specification |
| --- |
| HTML Standard # dom-timeranges-length-dev |

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
TimeRanges: start() method
==========================

The **`start()`** method of the `TimeRanges` interface returns the time offset at which a specified time range begins.

Syntax
------


```js
start(index)
```

### Parameters

`index`

The range number to return the starting time for.

### Return value

A number.

### Exceptions

`IndexSizeError` `DOMException`

 Thrown if the specified index doesn't correspond to an
 existing range.


Examples
--------

Given a video element with the ID "myVideo":


```js
const v = document.getElementById("myVideo");

const buf = v.buffered;

const numRanges = buf.length;

if (buf.length === 1) {
  // only one range
  if (buf.start(0) === 0 && buf.end(0) === v.duration) {
    // The one range starts at the beginning and ends at
    // the end of the video, so the whole thing is loaded
  }
}
```


 This example looks at the time ranges and looks to see if the entire video has been
 loaded.

Specifications
--------------

| Specification |
| --- |
| HTML Standard # dom-timeranges-start-dev |

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
TimeRanges: end() method
========================

The **`end()`** method of the `TimeRanges` interface returns the time offset at which a specified time range ends.

Syntax
------


```js
end(index)
```

### Parameters

`index`

The range number to return the ending time for.

### Return value

A number.

### Exceptions

`IndexSizeError` `DOMException`

Thrown if the specified index doesn't correspond to an existing range.

Examples
--------

Given a video element with the ID `"myVideo"`:


```js
const v = document.getElementById("myVideo");

const buf = v.buffered;

const numRanges = buf.length;

if (buf.length === 1) {
  // only one range
  if (buf.start(0) === 0 && buf.end(0) === v.duration) {
    // The one range starts at the beginning and ends at
    // the end of the video, so the whole thing is loaded
  }
}
```


 This example looks at the time ranges and looks to see if the entire video has been
 loaded.

Specifications
--------------

| Specification |
| --- |
| HTML Standard # dom-timeranges-end-dev |

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
EXT\_disjoint\_timer\_query: deleteQueryEXT() method
====================================================

 The **`EXT_disjoint_timer_query.deleteQueryEXT()`** method of
 the WebGL API deletes a given
 `WebGLQuery` object.

Syntax
------


```js
deleteQueryEXT(query)
```

### Parameters

`query`

A `WebGLQuery` object to delete.

### Return value

None (`undefined`).

Examples
--------


```js
const ext = gl.getExtension("EXT\_disjoint\_timer\_query");
const query = ext.createQueryEXT();

// …

ext.deleteQueryEXT(query);
```

Specifications
--------------

| Specification |
| --- |
| WebGL EXT\_disjoint\_timer\_query Extension Specification  |

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

See also
--------

* `WebGLRenderingContext.getExtension()`
* `WebGLQuery`
* `EXT_disjoint_timer_query`
EXT\_disjoint\_timer\_query: beginQueryEXT() method
===================================================

 The **`EXT_disjoint_timer_query.beginQueryEXT()`** method of
 the WebGL API starts a timer query.

Syntax
------


```js
beginQueryEXT(target, query)
```

### Parameters

`target`

 A `GLenum` specifying the target of the time query. Must be
 `ext.TIME_ELAPSED_EXT`.


`query`

A `WebGLQuery` object for which to start the time querying.

### Return value

None (`undefined`).

Examples
--------


```js
const ext = gl.getExtension("EXT\_disjoint\_timer\_query");
const query = ext.createQueryEXT();
ext.beginQueryEXT(ext.TIME\_ELAPSED\_EXT, query);

// …
```

Specifications
--------------

| Specification |
| --- |
| WebGL EXT\_disjoint\_timer\_query Extension Specification  |

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

See also
--------

* `WebGLRenderingContext.getExtension()`
* `WebGLQuery`
* `EXT_disjoint_timer_query`
EXT\_disjoint\_timer\_query: queryCounterEXT() method
=====================================================

 The **`EXT_disjoint_timer_query.queryCounterEXT()`** method of
 the WebGL API records the current time into
 the corresponding query object.

Syntax
------


```js
queryCounterEXT(query, target)
```

### Parameters

`query`

A `WebGLQuery` object for which to record the current time.

`target`

 A `GLenum` specifying the target of the time query. Must be
 `ext.TIMESTAMP_EXT`.


### Return value

None (`undefined`).

Examples
--------


```js
const ext = gl.getExtension("EXT\_disjoint\_timer\_query");
const startQuery = ext.createQueryEXT();
const endQuery = ext.createQueryEXT();
ext.queryCounterEXT(startQuery, ext.TIMESTAMP\_EXT);

// …

ext.queryCounterEXT(endQuery, ext.TIMESTAMP\_EXT);
```

Specifications
--------------

| Specification |
| --- |
| WebGL EXT\_disjoint\_timer\_query Extension Specification  |

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

See also
--------

* `WebGLRenderingContext.getExtension()`
* `WebGLQuery`
* `EXT_disjoint_timer_query`
EXT\_disjoint\_timer\_query: endQueryEXT() method
=================================================

 The **`EXT_disjoint_timer_query.endQueryEXT()`** method of the
 WebGL API ends a timer query.

Syntax
------


```js
endQueryEXT(target)
```

### Parameters

`target`

 A `GLenum` specifying the target of the time query. Must be
 `ext.TIME_ELAPSED_EXT`.


### Return value

None (`undefined`).

Examples
--------


```js
const ext = gl.getExtension("EXT\_disjoint\_timer\_query");
const query = ext.createQueryEXT();
ext.beginQueryEXT(ext.TIME\_ELAPSED\_EXT, query);

// …

ext.endQueryEXT(ext.TIME\_ELAPSED\_EXT);
```

Specifications
--------------

| Specification |
| --- |
| WebGL EXT\_disjoint\_timer\_query Extension Specification  |

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

See also
--------

* `WebGLRenderingContext.getExtension()`
* `WebGLQuery`
* `EXT_disjoint_timer_query`
EXT\_disjoint\_timer\_query: createQueryEXT() method
====================================================

 The **`EXT_disjoint_timer_query.createQueryEXT()`** method of
 the WebGL API creates and initializes
 `WebGLQuery` objects, which track the time needed to fully complete
 a set of GL commands.

Syntax
------


```js
createQueryEXT()
```

### Parameters

None.

### Return value

A `WebGLQuery` object.

Examples
--------


```js
const ext = gl.getExtension("EXT\_disjoint\_timer\_query");
const query = ext.createQueryExt();
```

Specifications
--------------

| Specification |
| --- |
| WebGL EXT\_disjoint\_timer\_query Extension Specification  |

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

See also
--------

* `WebGLRenderingContext.getExtension()`
* `WebGLQuery`
* `EXT_disjoint_timer_query`