Add beginLayer() and endLayer() methods to the CanvasRenderingContext2D interface, that create and close layers for Canvas. These methods provide an alternative method for applying a filter, shadow or compositing to a set of drawn operations (as opposed to a single one), other than having to create a temporary canvas and then draw the temporary canvas into the intended canvas. They will follow the same logic as save/restore in regards the full current state of the canvas.

Motivation

To apply a filter or compositing to a set of draw operations (as opposed to a single one), the only current solution is draw to a temporary canvas and then draw the temporary canvas into the final destination. This proposal adds an alternative to that by creating a layer that then will be drawn as a single unit. This would be equivalent to having a temporary canvas, except not only in a much more friendly way, but with the added benefit that the browser can take care of deciding what's the best dimension of the temporary canvas, given the current transform/clip.

Specification

Specification link


Specification currently under development in a Working Group

Status in Chromium

Blink


No active development (tracking bug)

Consensus & Standardization

After a feature ships in Chrome, the values listed here are not guaranteed to be up to date.

Owners

Last updated on 2021-12-09