[Date Prev][Date Next][Thread Prev][Thread Next][Date Index][Thread Index]

Re: [Public WebGL] Issues with sharing resources across contexts

On Thu, Jul 19, 2012 at 9:54 AM, Gregg Tavares (社用) <gman@google.com> wrote:
Uploading a texture is not instant period. Even if all you do is call glTexImage2D with raw data there's still overhead. Calling it in another thread means no overhead on the main thread which means no jank. Even in C programs I've had to do this and upload textures off the main thread.

In WebGL it's worse though. You have no control over the browser's image decoder. Does it decode in the foreground? Does it decode in the background? Maybe it decodes in the background but only on demand. Demand being that the image is displayed on the screen. That works for onscreen images since the browser can use a place holder until the image is ready. But when you use an image with WebGL the browser doesn't have that chance since there is no "displayed on the screen" or placeholder. It has to give you the correct image right now, synchronously. On top of that, let's assume it has decoded the image. There's no guarantee it decoded it in the correct format. Maybe you are asking for unpremultiplied alpha because you're loading from a PNG and your alpha channel is not actually alpha data. Or maybe you're loading an JPG but you want it uploaded in RGBA so it has to be converted to RGBA before calling glTexImage2D.
Slightly tangential, but the way that we offer up bytes to WebGL from encoded images is not really good.

For instance, if I transfer a bunch of JPEGs in a big blob, I need to:
var dst = new Uint8Array(size);
var src = "" Uint8Array(data, offset, size);
dst.set(src); // this is because blobs can't deal with proxy views
var builder = new BlobBuilder();
var blob = builder.getBlob('image/jpg');
var url = "">
var img = new Image();
img.src = "">

I find that rather silly. Yet, it is the shortest way to decode a bunch of bytes representing a JPEG in an array buffer, sadly. I'd like something like this:
var src = "" Uint8Array(data, offset, size);
var imgbytes = Image.decodeSync(src); // substitute Sync with Async and pass a callback
gl.texImage2D(imgbytes, ...);