There are difference between createImageBitmap from Image and from raw binary data.
When you pass Image to createImageBItmap then image will be decode in Main thread because Image instance can't be used in Worker Pool.
There are not difference between Image and ImageBitmap for this case when it used as texture.
For async (non blocking decoding) we MUST use a fetch API (or XHR) and pass Blob as image source to createImageBitmap.
Looking to profiler tab. You can see that Image Decoding runs in main thread and for 4k image took about 50 ms per image, but fetch is ok and main thread is not frozen.
gordonnl
commented
3 years ago
There are difference between
createImageBitmapfrom Image and from raw binary data.When you pass
ImagetocreateImageBItmapthen image will be decode in Main thread because Image instance can't be used in Worker Pool. There are not difference between Image and ImageBitmap for this case when it used as texture.For async (non blocking decoding) we MUST use a fetch API (or XHR) and pass Blob as image source to
createImageBitmap.Proof:
https://jsfiddle.net/r2bjg1L4/3/
Looking to profiler tab. You can see that Image Decoding runs in main thread and for 4k image took about 50 ms per image, but fetch is ok and main thread is not frozen.