On: CSS Paint API: New possibilities in Chrome 65

[freddywang]

we already had this all the way back in 2008. It's called webkit css canvas! Iconapp.io is using that heavily!

background: -webkit-canvas(mycanvas);

[ithkuil → freddywang]

with the CSS Paint API you instantiate a new canvas like object for every time your reference the painter, while this was referencing one specific instance of a canvas, right?

[bsimpson → ithkuil]

I don't know the internals of either.

In a Paint Worklet, the canvas is generated for you, and your painter is automatically called every time an input property changes.

In -webkit-canvas, you manually instantiate the canvas and manually repaint it.

It's the difference between reactive and procedural programming (even though the actual painter is procedural in either case).

Here's a gist I threw together showing how to use the same paint function with either API:

https://gist.github.com/appsforartists/e5d2a4b7826bf5962fad1...

[freddywang → ithkuil]

Yes, the only downside is that you have to procedurally instantiate a canvas. You get to control when the render event should happen though. With CSS Paint API, it feels like declaring webgl shader.