Drawing webgl icons all over web site: one canvas, or multiple canvases?

I’m curious if anyone has thoughts on how one would, for example, place many little WebGL-powered icons in different places of an otherwise regular web app.

In particular, I’m wondering if anyone has any thoughts on using a single canvas laid on top of the whole site, and using webgl stencil to draw to portions of it, vs placing many little canvases in each spot.

Any ideas on the performance differences between those approaches?

That’s exactly what this example does: WebGL Multiple Elements. And also this one: WebGL Multiple Elements with Text.

Multiple HTML <div>s, but only one canvas pretending to render inside each div.

1 Like

Ah, thanks! I forgot about those. I’m guessing that’s more performant than multiple canvases that way.