Limited supportUse with care and provide a fallback when broad support matters.

Overview

The optional desynchronized parameter of a canvas's getContext() method permits the browser to draw a 2D canvas independently of the event loop. This can reduce drawing latency. It is most useful when native HTML semantics or browser capabilities can replace custom implementation work.

Browser support

Feature Desktop Mobile
Chrome
Edge
Firefox
Safari
Chrome Android
Safari iOS
api.HTMLCanvasElement.getContext.2d_context.options_desynchronized_parameter
81
79
15
75
15
1+Supported (version) Not supported Has note Sub-feature descriptions sourced from MDN Web Docs (CC BY-SA 2.5)
Notes 4 item(s)
Implementation note
  • ChromeOS and Windows
  • ChromeOS only
Limitation
  • This browser only partially implements this feature
Removed
  • This feature was removed in a later browser version (81)

Syntax

JAVASCRIPT
const ctx = canvas.getContext('2d', { desynchronized: true });
// Skip compositing for low-latency rendering
ctx.lineWidth = 2;
ctx.strokeStyle = '#000';

Live demo

Low-latency drawing hint

Describe the desynchronized hint used for responsive drawing surfaces.

PreviewFullscreen

Typical uses

List the interfaces that benefit most from low-latency canvas updates.

PreviewFullscreen

Latency trade-offs

Explain that low-latency hints may interact with compositing and rendering guarantees.

PreviewFullscreen

Use cases

  • Draw custom visuals

    Use Desynchronized 2D canvas when browser rendering surfaces need more control for charts, media, or interactive graphics.

  • Support advanced rendering

    Apply Desynchronized 2D canvas where GPU-backed or low-level drawing improves the experience.

Cautions

  • Test Desynchronized 2D canvas in your target browsers and input environments before depending on it as a primary behavior.
  • Provide a fallback path or acceptable degradation strategy when support is still limited.

Accessibility

  • Make sure Desynchronized 2D canvas supports the intended task without making the page harder to perceive, understand, or operate.

Powered by web-features