HTMLVideoElement: cancelVideoFrameCallback() method

Baseline 2024
Newly available

Since October 2024, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers.

The cancelVideoFrameCallback() method of the HTMLVideoElement interface cancels a previously-registered video frame callback.

Syntax

js
cancelVideoFrameCallback(id)

Parameters

id

A number representing the ID of the video frame callback you want to cancel. This will be the value returned by the corresponding HTMLVideoElement.requestVideoFrameCallback call.

Return value

None (undefined).

Examples

Canceling a video frame callback

This example shows how to use cancelVideoFrameCallback() to cancel a previously-registered video frame callback.

js
const updateCanvas = (now, metadata) => {
  // Do something with the frame

  // ...

  // Re-register the callback to run on the next frame
  // It's important to update the videoCallbackId on each iteration
  // so you can cancel the callback successfully
  videoCallbackId = video.requestVideoFrameCallback(updateCanvas);
};

// Initial registration of the callback to run on the first frame
let videoCallbackId = video.requestVideoFrameCallback(updateCanvas);

// ...

// Cancel video frame callback using the latest videoCallbackId
video.cancelVideoFrameCallback(videoCallbackId);

Specifications

Specification
HTMLVideoElement.requestVideoFrameCallback()
# dom-htmlvideoelement-cancelvideoframecallback

Browser compatibility

Report problems with this compatibility data on GitHub
desktopmobile
Chrome
Edge
Firefox
Opera
Safari
Chrome Android
Firefox for Android
Opera Android
Safari on iOS
Samsung Internet
WebView Android
WebView on iOS
cancelVideoFrameCallback

Legend

Tip: you can click/tap on a cell for more information.

Full support
Full support
See implementation notes.

See also