How to draw scenes onto a specific framebuffer?

Unity Engine
1

GOAL: Adapt the emscripten mainLoop process so that Unity WebGL draws its scenes onto a specified framebuffer from the same context (which already contains image data from another proces).

I’ve already figured out how to “track” the rendering process by overwriting most of the _gl* functions through .jslib plugins and logging their params to the console, but I am completely lost as to why all these steps are taken and how I can modify these to achieve my goal as described above.

What I’ve figured out so far:

  • 4 framebuffers are generated only once after the Input Manager has initialised. (Scene dependent?)
  • Each of these 4 framebuffers are given an ID somewhere between 0 and around 150.
  • Each of these 4 framebuffers differ in how they are processed, some get drawn to, some do texture2D operations, some get bound and don’t appear to do anything at all.
  • Each of these 4 framebuffers is always bound in the same order every frame.
  • At the end of each frameloop the GLctx bound framebuffer is reset to the default and drawn to.

From what I can observe, it appears Unity WebGL uses multiple framebuffers to process multiple things in a fixed order.
What I’ve tried so far:

  • Bind my framebuffer at the beginning of the requestAnimationFrame callback.
  • Replace every generated framebuffer with the given one.
  • Intercept the final framebuffer reset to default in the hopes it would “draw all accumulated content”

None of the above seem to have worked, the rendering of the predefined framebuffer only shows the image data from the other process.

Can someone explain how this loop works exactly, and what gets drawn to these 4 framebuffers?

2

[offtop]
I’m curious why webgl need 4 framebuffers, not 1?!
There are probably additional buffer (not framebuffer, but temp) for render image effects.
[/offtop]

As an idea you can try some code on js side for take canvas, take webgl context, and try to get framebuffer on js side… you can write jspre or pure js file and add to preloader (bind to html) after callback onUnityInitialized

UnityLoader.instantiate(
                            document.getElementById("gameContainer"),
                            "%UNITY_WEBGL_BUILD_URL%",
                            { // override
                                onProgress: onProgressCoeffForUnity,
                                Module: {
                                    preInit: [onUnityStartInitializing],
                                    onRuntimeInitialized: onUnityInitialized
 
                                   }
                           }
                           );

onUnityInitialized()
{
  var canvas = document.getElementsByTagName('canvas')[0];
  var context = canvas.getContext('webgl2'); // or webgl1
}