Implement async read back of textures

[mvaligursky]

We need a public API tp allow render target textures to be accessed by the CPU. Ideally this API would be async, allowing to take advantage of async API for WebGl2 and WebGPU.

This would avoid main thread being blocked waiting for GPU to finish rendering and transfer back the texture. https://forum.babylonjs.com/t/speeding-up-readpixels/12739

WebGL2: https://developer.mozilla.org/en-US/docs/Web/API/WebGL2RenderingContext/fenceSync

Requirements:

• WebGPU requires a texture interface to read from, making a parameter for this function to be a texture
• Allow sub-area to be copied - this is required by Picker for example
• Allow reading from any mipmap
• If null is specified as a texture, reading from the backbuffer should execute (on WebGPU this means from texture returned by gpuContext.getCurrentTexture())

[mvaligursky]

adding @slimbuck here as well as he was interested to work on this as well.

[mvaligursky]

forum thread: https://forum.playcanvas.com/t/cant-read-from-a-texture-locked-with-texturelock-read-it-doesnt-seem-to-do-anything/26402/2

[mvaligursky]

WebGL implementation: https://github.com/playcanvas/engine/pull/5332

[mvaligursky]

webgpu example implementation: https://www.sobyte.net/post/2022-02/webgpu-buffer-mapping/#22-gpu-to-cpu

[erikdubbelboer]

This is sort of implemented in https://github.com/playcanvas/engine/pull/6009, here and here.