recursal/MDN huggingface dataset:
PerformanceEventTiming: cancelable property
===========================================

The read-only **`cancelable`** property returns the associated event's `cancelable` property, indicating whether the event can be canceled.

Value
-----

A boolean. `true` if the associated event is cancelable, `false` otherwise.

Examples
--------

### Observing non-cancelable events

The `cancelable` property can be used when observing event-timing entries (`PerformanceEventTiming`). For example, to log and measure non-cancelable events only.


```js
const observer = new PerformanceObserver((list) => {
  list.getEntries().forEach((entry) => {
    if (!entry.cancelable) {
      const delay = entry.processingStart - entry.startTime;
      console.log(entry.name, delay);
    }
  });
});

// Register the observer for events
observer.observe({ type: "event", buffered: true });
```

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

| Specification |
| --- |
| Event Timing API # dom-performanceeventtiming-cancelable |

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

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
VideoTrack: kind property
=========================

 The **`kind`** property contains a
 string indicating the category of video contained in the
 **`VideoTrack`**.

 The `kind` can be used
 to determine the scenarios in which specific tracks should be enabled or disabled. See
 Video track kind strings for a list of the kinds available for video tracks.

Value
-----

 A string specifying the type of content the media represents. The
 string is one of those found in Video track kind strings below.

Video track kind strings
------------------------

The kinds available for video tracks are:

`"alternative"`

 A potential alternative to the main track, such as a different video take or a
 version of the soundtrack with only the music and no dialogue.


`"captions"`

A version of the main video track with captions burnt in.

`"main"`

The primary video track.

`"sign"`

A sign-language interpretation of an audio track.

`"subtitles"`

A version of the main video track with subtitles burnt in.

`"commentary"`

 A video track containing a commentary. This might be used to contain the director's
 commentary track on a movie, for example.


`""` (empty string)

 The track doesn't have an explicit kind, or the kind provided by the track's
 metadata isn't recognized by the user agent.


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

| Specification |
| --- |
| HTML Standard # dom-videotrack-kind-dev |

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

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
VideoTrack: id property
=======================

 The **`id`** property contains a
 string which uniquely identifies the track represented by the
 **`VideoTrack`**.

 This ID can be used with the
 `VideoTrackList.getTrackById()` method to locate a specific track within
 the media associated with a media element.

 The track ID can also be used as the fragment of a URL that loads the specific track
 (if the media supports media fragments).

Value
-----

 A string which identifies the track, suitable for use when calling
 `getTrackById()` on an
 `VideoTrackList` such as the one specified by a media element's
 `videoTracks` property.

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

| Specification |
| --- |
| HTML Standard # dom-videotrack-id-dev |

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

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
VideoTrack: selected property
=============================

 The **`VideoTrack`** property
 **`selected`** controls whether or not a particular video
 track is active.

Value
-----

 The `selected` property is a Boolean whose value is `true` if the
 track is active. Only a single video track can be active at any given time, so setting
 this property to `true` for one track while another track is active will make
 that other track inactive.

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

| Specification |
| --- |
| HTML Standard # dom-videotrack-selected-dev |

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

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
VideoTrack: language property
=============================

 The read-only **`VideoTrack`**
 property **`language`** returns a string identifying the
 language used in the video track.

 For tracks that include multiple languages
 (such as a movie in English in which a few lines are spoken in other languages), this
 should be the video's primary language.

Value
-----

 A string specifying the BCP 47 (RFC 5646) format language tag of
 the primary language used in the video track, or an empty string (`""`) if
 the language is not specified or known, or if the track doesn't contain speech.

 For example, if the primary language used in the track is United States English, this
 value would be `"en-US"`. For Brazilian Portuguese, the value would be
 `"pt-BR"`.

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

| Specification |
| --- |
| HTML Standard # dom-videotrack-language-dev |

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

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
VideoTrack: sourceBuffer property
=================================

 The read-only **`VideoTrack`**
 property **`sourceBuffer`** returns the
 `SourceBuffer` that created the track, or null if the track was not
 created by a `SourceBuffer` or the `SourceBuffer` has been
 removed from the `MediaSource.sourceBuffers` attribute of its parent
 media source.

Value
-----

A `SourceBuffer` or null.

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

| Specification |
| --- |
| Media Source Extensions™ # dom-videotrack-sourcebuffer |

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

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
VideoTrack: label property
==========================

 The read-only **`VideoTrack`**
 property **`label`** returns a string specifying the video
 track's human-readable label, if one is available; otherwise, it returns an empty
 string.

Value
-----

 A string specifying the track's human-readable label, if one is
 available in the track metadata. Otherwise, an empty string (`""`) is
 returned.

 For example, a track whose `kind` is
 `"sign"` might have a `label` such as
 `"A sign-language interpretation."`.

Examples
--------

 This example returns an array of track kinds and labels for potential use in a user
 interface to select video tracks for a specified media element. The list is filtered to
 only allow certain track kinds through.


```js
function getTrackList(el) {
  const trackList = [];
  const wantedKinds = ["main", "alternative", "commentary"];

  el.videoTracks.forEach((track) => {
    if (wantedKinds.includes(track.kind)) {
      trackList.push({
        id: track.id,
        kind: track.kind,
        label: track.label,
      });
    }
  });
  return trackList;
}
```


 The resulting `trackList` contains an array of video tracks whose
 `kind` is one of those in the array `wantedKinds`, with each entry
 providing the track's `id`, `kind`, and `label`.

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

| Specification |
| --- |
| HTML Standard # dom-videotrack-label-dev |

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

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
RTCStatsReport: size property
=============================

The **`size`** read-only property of the `RTCStatsReport` interface returns the number of items in the current report.

Note that each item consists of a key-value pair, where the keys are unique `id` values for monitored statistics objects from which the statistics are derived, and the associated values are statistics dictionary objects.

This property is otherwise the same as `Map.prototype.size`.

Value
-----

 An integer indicating the number of items in this report.
 The value is zero if the report is empty.

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

| Specification |
| --- |
| WebRTC: Real-Time Communication in Browsers # dom-rtcstatsreport |

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

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

See also
--------

* `Map`
RTCStatsReport: values() method
===============================

The **`values()`** method of the `RTCStatsReport` interface returns a new *iterator* object that can be used to iterate through the values for each element in the `RTCStatsReport` object, in insertion order.

The values are statistics dictionary objects.

The method is otherwise the same as `Map.prototype.values()`.

Syntax
------


```js
values()
```

### Return value

A new iterable iterator object.

Examples
--------

This example shows how to iterate through a `RTCStatsReport` using the iterator returned by `values()`.

 Given a variable `myPeerConnection`, which is an instance of `RTCPeerConnection`, the code calls `getStats()` with `await` to wait for the statistics report.
 It then uses a for...of loop, with the iterator returned by `values()`, to iterate through the dictionary objects in the report.
 The properties of statistics objects with the `type` of `outbound-rtp` are logged to the console (other objects are discarded).


```js
const stats = await myPeerConnection.getStats();

for (const stat of stats.values()) {
  if (stat.type != "outbound-rtp") continue;
  Object.keys(stat).forEach((statName) => {
    console.log(`${statName}: ${report[statName]}`);
  });
}
```

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

#### No specification found

No specification data found for `api.RTCStatsReport.values`.  
Check for problems with this page or contribute a missing `spec_url` to mdn/browser-compat-data. Also make sure the specification is included in w3c/browser-specs.

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

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

See also
--------

* `Map.prototype.values()`
* `RTCStatsReport.keys()`
* `RTCStatsReport.entries()`
RTCStatsReport: keys() method
=============================

The **`keys()`** method of the `RTCStatsReport` interface returns a new *iterator* object that can be used to iterate through the keys for each element in the `RTCStatsReport` object, in insertion order.

The keys in the `RTCStatsReport` are unique string `id` values, which represent the monitored statistics objects from which the statistics are derived.

The method is otherwise the same as `Map.prototype.keys()`.

Syntax
------


```js
keys()
```

### Return value

A new iterable iterator object.

Examples
--------

This example shows how to iterate through a `RTCStatsReport` using the iterator returned by `keys()`.

 Given a variable `myPeerConnection`, which is an instance of `RTCPeerConnection`, the code calls `getStats()` with `await` to wait for the statistics report.
 It then uses a for...of loop, with the iterator returned by `keys()`, to iterate through the IDs.
 Each ID is used to get the corresponding statistics dictionary.
 The properties of statistics objects with the `type` of `outbound-rtp` are logged to the console (other objects are discarded).


```js
const stats = await myPeerConnection.getStats();

for (const id of stats.keys()) {
  // Get dictionary associated with key (id)
  const stat = stats.get(id);
  if (stat.type != "outbound-rtp") continue;
  Object.keys(stat).forEach((statName) => {
    console.log(`${statName}: ${report[statName]}`);
  });
}
```


 Note that this examples is somewhat contrived.
 You could more easily iterate with `entries()` or `values()` and not have to map the ID to a value.
 You can even iterate the `RTCStatsReport` itself, as it has the `@@iterator` method!

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

| Specification |
| --- |
| WebRTC: Real-Time Communication in Browsers # dom-rtcstatsreport |

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

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

See also
--------

* `Map.prototype.keys()`
* `RTCStatsReport.values()`
* `RTCStatsReport.entries()`
RTCStatsReport: entries() method
================================

The **`entries()`** method of the `RTCStatsReport` interface returns a new iterator object that can be used to iterate through the key/value pairs for each element in the `RTCStatsReport` object, in insertion order.

The keys are unique `id` values for monitored statistics objects from which the statistics are derived, and the associated values are statistics dictionary objects.

The method is otherwise the same as `Map.prototype.entries()`.

Syntax
------


```js
entries()
```

### Parameters

None.

### Return value

A new iterable iterator object.

Examples
--------

This example shows how to iterate through a `RTCStatsReport` using the iterator returned by `entries()`.

 Given a variable `myPeerConnection`, which is an instance of `RTCPeerConnection`, the code calls `getStats()` with `await` to wait for the statistics report.
 It then uses a for...of loop, with the iterator returned by `entries()`, to iterate through the entries.
 The properties of statistics objects with the `type` of `outbound-rtp` are logged to the console (other objects are discarded).


```js
const stats = await myPeerConnection.getStats();

for (const stat of stats.entries()) {
  if (stat.type != "outbound-rtp") continue;
  Object.keys(stat).forEach((statName) => {
    console.log(`${statName}: ${report[statName]}`);
  });
}
```

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

| Specification |
| --- |
| WebRTC: Real-Time Communication in Browsers # dom-rtcstatsreport |

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

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

See also
--------

* `Map.prototype.entries()`
* `RTCStatsReport.values()`
* `RTCStatsReport.keys()`
RTCStatsReport: get() method
============================

The **`get()`** method of the `RTCStatsReport` interface returns a specified element from an `RTCStatsReport`.

 Elements in the `RTCStatsReport` are identified by unique `id` values, which represent the monitored statistics objects from which the statistics are derived.
 The element returned will be an instance of one of the statistics dictionary objects, and it will contain statistics for the object with the given `id`.
 The fetched value is a reference to the statistics dictionary, and any change made to that object will effectively modify it inside the `RTCStatsReport` object.

The method is otherwise the same as `Map.prototype.get()`.

Syntax
------


```js
get(id)
```

### Parameters

`id`

 A string indicating the ID of the element to return from the `RTCStatsReport` object.
 IDs are unique strings that identify the monitored object from which the corresponding statistics are derived.


### Return value

The element associated with the specified `id` key, or `undefined` if the key can't be found in the `Map` object.

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

| Specification |
| --- |
| WebRTC: Real-Time Communication in Browsers # dom-rtcstatsreport |

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

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

See also
--------

* `Map.prototype.get()`
RTCStatsReport: [@@iterator]() method
=====================================

 The **`[@@iterator]()`** method of the `RTCStatsReport` interface implements the iterable protocol and allows statistics reports to be consumed by most syntaxes expecting iterables, such as the spread syntax and `for...of` loops.
 It returns an iterator object that yields the key-value pairs of the report in insertion order.

The initial value of this property is the same function object as the initial value of the `RTCStatsReport.entries()` method.

The method is otherwise the same as `Map.prototype[@@iterator]()`.

Syntax
------


```js
RTCStatsReport[Symbol.iterator]()
```

### Return value

 The same return value as `RTCStatsReport.entries()`.
 This is a new iterable iterator object that yields the key-value (`id`-"statistics dictionary") pairs of the report.

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

#### No specification found

No specification data found for `api.RTCStatsReport.@@iterator`.  
Check for problems with this page or contribute a missing `spec_url` to mdn/browser-compat-data. Also make sure the specification is included in w3c/browser-specs.

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

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

See also
--------

* `RTCStatsReport.entries()`
* `Map.prototype[@@iterator]()`
RTCStatsReport: has() method
============================

The **`has()`** method of the `RTCStatsReport` interface returns a boolean indicating whether a report contains a statistics dictionary with the specified id.

The method is otherwise the same as `Map.prototype.has()`.

Syntax
------


```js
has(id)
```

### Parameters

`id`

A string containing the ID of a statistics object that might be present in this `RTCStatsReport`.

### Return value

`true` if an element with the specified `id` exists in the `RTCStatsReport` object; otherwise `false`.

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

| Specification |
| --- |
| WebRTC: Real-Time Communication in Browsers # dom-rtcstatsreport |

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

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

See also
--------

* `Map`
* `Map.prototype.set()`
* `Map.prototype.get()`
RTCStatsReport: forEach() method
================================

The **`forEach()`** method of the `RTCStatsReport` interface executes a provided function once for each key/value pair in the `RTCStatsReport` object, in insertion order.

The keys are unique `id` values for the monitored statistics objects from which the statistics are derived, and the associated values are statistics dictionary objects.

The method is otherwise the same as `Map.prototype.forEach()`.

Syntax
------


```js
forEach(callbackFn)
forEach(callbackFn, thisArg)
```

### Parameters

`callbackFn`

 A function to execute for each entry in the report.
 The function is called with the following arguments:


`report`

 Statistics report for each iteration.
 This can be any of the statistics dictionary types.


`id`

A unique string identifying the monitored object from which the statistics are derived.

`map`

The report being iterated.


`thisArg` Optional

A value to use as `this` when executing `callbackFn`.

### Return value

`undefined`.

Examples
--------

 Given a variable `myPeerConnection`, which is an instance of `RTCPeerConnection`, the code calls `getStats()` with `await` to wait for the statistics report.
 It then iterates the report using `RTCStatsReport.forEach()`, and filters the dictionaries for just those reports that have the `type` of `inbound-rtp` and `kind` of `video`.
 For matching dictionaries it logs the `framesPerSecond` property of the inbound video.


```js
const stats = await myPeerConnection.getStats();

stats.forEach((report) => {
  if (report.type === "inbound-rtp" && report.kind === "video") {
    // Log the frame rate
    console.log(report.framesPerSecond);
  }
});
```

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

| Specification |
| --- |
| WebRTC: Real-Time Communication in Browsers # dom-rtcstatsreport |

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

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

See also
--------

* `Map.prototype.forEach()`
Scheduling: isInputPending() method
===================================

**Experimental:** **This is an experimental technology**  
Check the Browser compatibility table carefully before using this in production.

The **`isInputPending()`** method of the `Scheduling` interface allows you to check whether there are pending input events in the event queue, indicating that the user is attempting to interact with the page.

This feature is useful in situations where you have a queue of tasks to run, and you want to yield to the main thread regularly to allow user interaction to occur so that the app is kept as responsive and performant as possible. `isInputPending()` allows you to yield only when there is input pending, rather than having to do it at arbitrary intervals.

`isInputPending()` is called using `navigator.scheduling.isInputPending()`.

Syntax
------


```js
isInputPending()
isInputPending(options)
```

### Parameters

`options` Optional

An object providing options. Currently, the only option is:

`includeContinuous` Optional

A boolean, which is `false` by default. If set to `true`, it indicates that continuous events should be considered when checking for pending input. Continuous events are trusted events (events dispatched by the browser) that are fired successively, such as `mousemove`, `wheel`, `touchmove`, `drag`, `pointermove`, and `pointerrawupdate`.


### Return value

A boolean that indicates whether there are pending input events in the event queue (`true`) or not (`false`).

Examples
--------

We can use `isInputPending()` inside a task runner structure to run the `yield()` function only when the user is attempting to interact with the page:


```js
function yield() {
  return new Promise((resolve) => {
    setTimeout(resolve, 0);
  });
}

async function main() {
  // Create an array of functions to run
  const tasks = [a, b, c, d, e];

  while (tasks.length > 0) {
    // Yield to a pending user input
    if (navigator.scheduling.isInputPending()) {
      await yield();
    } else {
      // Shift the first task off the tasks array
      const task = tasks.shift();

      // Run the task
      task();
    }
  }
}
```


This allows you to avoid blocking the main thread when the user is actively interacting with the page, potentially providing a smoother user experience. However, by only yielding when necessary, we can continue running the current task when there are no user inputs to process. This also avoids tasks being placed at the back of the queue behind other non-essential browser-initiated tasks that were scheduled after the current one.

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

| Specification |
| --- |
| Early detection of input events # dom-scheduling-isinputpending |

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

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

See also
--------

* Faster input events with Facebook's first browser API contribution on engineering.fb.com (2019)
* Better JS scheduling with isInputPending() on developer.chrome.com (2020)
* Optimizing long tasks on web.dev (2022)
ServiceWorkerGlobalScope: activate event
========================================

The **`activate`** event of the `ServiceWorkerGlobalScope` interface is fired when a `ServiceWorkerRegistration` acquires a new `ServiceWorkerRegistration.active` worker.

This event is not cancelable and does not bubble.

Syntax
------

Use the event name in methods like `addEventListener()`, or set an event handler property.


```js
addEventListener("activate", (event) => {});

onactivate = (event) => {};
```

Event type
----------

An `ExtendableEvent`. Inherits from `Event`.

Event

ExtendableEventEvent properties
----------------

*Doesn't implement any specific properties, but inherits properties from its parent, `Event`.*

Examples
--------

The following snippet shows how you could use an `activate` event handler to upgrade a cache.


```js
self.addEventListener("activate", (event) => {
  const cacheAllowlist = ["v2"];

  event.waitUntil(
    caches.forEach((cache, cacheName) => {
      if (!cacheAllowlist.includes(cacheName)) {
        return caches.delete(cacheName);
      }
    }),
  );
});
```


You can also set up the event handler using the `onactivate` property:


```js
self.onactivate = (event) => {
  // ...
};
```

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

| Specification |
| --- |
| Service Workers # service-worker-global-scope-activate-event |
| Service Workers # dom-serviceworkerglobalscope-onactivate |

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

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

See also
--------

* `install` event
* `ServiceWorkerGlobalScope`
* Service Worker API