[blink-dev] Intent to Implement: HTMLCanvasElement toBlob

[Olivia Lai]

Contact emails

xl...@chromium.org (developer)

Spec

https://html.spec.whatwg.org/multipage/scripting.html#dom-canvas-toblob

Summary

Creates a Blob object representing a file containing the image in the canvas, and invokes a callback with a handle to that object.

Motivation

Currently, the html5 canvas element has a toDataURL method, which outputs a DOM string representing the backing bitmap. With the File API now widely implemented, it is appropriate to add a similar getBlob method, one which would return a Blob object. Passing Blob pointers around is quite a bit more efficient than passing large base64 encoded strings.

Ongoing technical constraints

None

Will this feature be supported on all six Blink platforms (Windows, Mac, Linux, Chrome OS, Android, and Android WebView)?

Yes

OWP launch tracking bug

http://crbug.com/67587

Link to entry on the feature dashboard

https://www.chromestatus.com/features/4562033294966784

Requesting approval to ship?

No

[Dave Tapuska]

Just to bring up there is some discussion as to adding a similar API to ImageData..

See:

https://lists.w3.org/Archives/Public/public-wicg/2015Aug/0004.html

Might be useful to ensure your implementation is mindful of the proposed spec so a lot of rework wouldn't need to be done to implement it if the spec goes forward.

dave.

To unsubscribe from this group and stop receiving emails from it, send an email to blink-dev+...@chromium.org.

[Olivia Lai]

I'll take note of this new API proposal to ImageData. 

We intend to implement the toBlob for canvas in several phrases. Right now, Chrome doesn't support this function at all; so in the first phase, we just deliver the callback version of it, as what other browsers (FF, IE) have already supported. Afterwards, I'll implement the promise version of toBlob for canvas in the second phase; that would be related to another different issue 523417.

In the new API proposal, the ImageData.toBlob returns Promise<Blob>, which will be exactly same as the promise-based toBlob that I'm going to implement in the second phase. I'll make sure that the code is reusable.

[dominic...@gmail.com]

Really looking forward to this as using toDataURL with large images in the canvas is sloow!