Switching renderer type dynamically

[MichalGo]

Hello.

What would be the best solution in order to switch the renderer type (webgl/canvas) dynamically? The case is:

I change some textures on events (next/previous photo feature). Some of these cannot fit into webGL as the texture size is too big, so for them I have to switch to the canvas renderer. Currently I create two separated canvas elements and initiate two separated apps - one with the canvas renderer and the another one with the webGL renderer. For images which can fit into webGL I hide the app with the canvas renderer and use webGL for other I do the same with the second renderer. To achieve that I remove all children from the unused stage(app) and set renderer as display: none and then add new data to the second stage and display it. Not sure if it's the proper method in order to accomplish best results (performance etc). Is there a better way to do that?. I tried with just one app, and rebuilding it but I encountered a problem with the canvas element as it already had loaded certain context and could not do it again. I tried also with creating the canvas element dynamically (remove and create new then rebuild the app once again in order to get different context) but still with no luck. Any suggestions?

Thanks in advance.

[ivan.popelyshev]

No problem, just destroy webgl and create canvas renderer. You dont have to do anything with stage - it'll work anyway. The only problem are renderTextures.

> I tried with just one app

yes, you right, need to switch canvas. Canvas usually created inside renderer but if you pass it you have to pass new canvas in new renderer anyway.

I once again reference https://github.com/pixijs/pixi.js/wiki/v5-Custom-Application-GameLoop

However, its the first time i hear that someone wants to switch renderer type on fly.