robert.schiemann Posted January 27, 2021 Share Posted January 27, 2021 Hello! I've developed an open source application called Mantis Viewer that is being used by a few scientific institutions to visualize and analyze microscopy data. We started this project a couple of years ago, and it's built using TypeScript, Electron, React, MobX, and PixiJS. Currently, it's being used by the institute I work for to analyze data from our clinical trials, and is also being used by labs at Stanford and UCLA to develop new microscope technologies. Recently, a few users have been running into an issue where the WebGL context gets lost, and the renderer then fails to load (almost) everything after that. I've started to debug this and have built out some code to simulate a WebGL context loss on the canvas and recover. The code I've written works for a simulated context loss using webgl2Context.getExtension('WEBGL_lose_context')?.loseContext(), but fails to recover in real world examples that are, unfortunately, difficult to replicate. I'm the sole developer on this, and this project is my first Electron, React, and PixiJS project. I've posted this as an issue on the PixiJS GitHub as I think it might be bug, but it's entirely possible that I'm using something (or lots of things) incorrectly that's causing this issue. I'm open to any feedback for things I could change in the linked code that could improve this issue, or anything else that I haven't run into yet for that matter. This is what an image rendered in the application with annotations looks like initially: Immediately after this type of WebGL context loss and recovery, everything fails to render except for the text of the legend in the top left. If the user switches to a different set of images, the image sprites will load again, but the legend background (graphics object), zoom inset (graphics object), cell annotations (graphics object), and regions of interest (sprite created from graphics object pixel extract) still won't load. If they switch back to the first set of images where the context was originally lost, those image sprites will still fail to load. Unfortunately this bug is pretty difficult to reproduce and might be dependent on the graphics capabilities of the system. I've only been able to reproduce this bug once on my system, but I have some users who are able to reproduce it within a couple of minutes. If anyone is interested in trying to reproduce it, I'd be happy to share a few images that you can play with and one of the test builds. The project is open source, and I'm happy to share the code that's failing. Most of our image rendering and interaction code is in this ImageViewer React component, which links to a branch where I'm actively working on debugging this issue. Currently the function that deals with handling a WebGL context loss is called handleWebGlContextLost and is on line 600 of ImageViewer. The other bulk of PIXI related code can be found in the GraphicsHelper module. ivan.popelyshev and jonforum 2 Quote Link to comment Share on other sites More sharing options...
ivan.popelyshev Posted January 27, 2021 Share Posted January 27, 2021 Do you have any RenderTexture's ? We cant really restore them Quote Link to comment Share on other sites More sharing options...
robert.schiemann Posted January 27, 2021 Author Share Posted January 27, 2021 Thanks for the reply Ivan! I'm not using any RenderTextures yet. I just learned about them while Googling this issue, and was planning to play around with them today. Good to know that Pixi can't restore things, thanks! I can add logic to reload the images from file. The other problem I'm having is that even after I've recovered from this WebGL context loss, Pixi doesn't seem to be able to render any geometric objects (e.g. generated with moveTo, drawRoundedRect, drawPolygon or similar) even on newly created Graphics objects. For example, the legend in the top left corner is drawn in its own Graphics object. After the WebGL context loss happens I destroy the old legend Graphics and create a new one, re-draw the legend, and then re-render everything. Even though I'm creating a new legend Graphics and re-drawing everything for the legend, Pixi only renders the text on the legend and doesn't render the white or black rounded rectangles that make up the background. Is there something that I'm missing here? Quote Link to comment Share on other sites More sharing options...
ivan.popelyshev Posted January 27, 2021 Share Posted January 27, 2021 That's very strange, can you make a simple demo please? I fixed context loss multiple times, and if we made a new bug - we really have to fix it! Quote Link to comment Share on other sites More sharing options...
jonforum Posted January 27, 2021 Share Posted January 27, 2021 20 hours ago, robert.schiemann said: I'm open to any feedback for things I could change in the linked code that could improve this issue, or anything else that I haven't run into yet for that matter. i dont want say bullshit but you have nothing to lost by try adding some args to electron ! "chromium-args": "--gpu-no-context-lost --force-gpu-mem-available-mb=9999999 --max-active-webgl-contexts=32 --max-decoded-image-size-mb=1000 --enable-zero-copy" i also add zero copy just in case your costumer use integrate gpu, purely random suggest ! see `What are zero-copy texture uploads?`https://software.intel.com/content/www/us/en/develop/articles/native-one-copy-texture-uploads-for-chrome-os-on-intel-architecture-enabled-by-default.html it can lead you nowhere, on my side I always overload my arguments and pixijs has always been stable even at its limits! But webgl lost context , seem a real random issue over the web ! I have never seen a concrete and definitive answer. gl and nice project ! Quote Link to comment Share on other sites More sharing options...
robert.schiemann Posted January 28, 2021 Author Share Posted January 28, 2021 I will try to make a demo for you ivan.popelyshev. I've been having a hard time replicating this on my machine, but I'll give a try at replicating this in a sandboxed environment. Thanks for the advice and compliment jonforum! Haha, I love the electron/chromium flag solution. I haven't run into any of those flags before. I'll try adding them and cross my fingers that they help! What's that profiling tool that you posted screenshots of? In case you ever run into context loss issues, I read that the following can also be helpful. app.commandLine.appendSwitch('disable-gpu-process-crash-limit') app.disableDomainBlockingFor3DAPIs() Quote Link to comment Share on other sites More sharing options...
ivan.popelyshev Posted January 28, 2021 Share Posted January 28, 2021 You dont have to replicate crash itself, just use loseContext /restoreContext stuff and see what wasnt restored. Also, Graphics with 100 vertices and graphics with 101 vertex are handled differently. If there are only 100 vertices, it wont be uploaded to GPU as geometry, it will be batched with everything else Quote Link to comment Share on other sites More sharing options...
jonforum Posted January 28, 2021 Share Posted January 28, 2021 (edited) 2 hours ago, robert.schiemann said: I love the electron/chromium flag solution. I haven't run into any of those flags before. I'll try adding them and cross my fingers that they help! What's that profiling tool that you posted screenshots of? if you have exhausted all your resources! you have a full list here for experiment purpose, they are userfull for Nwjs and Electron.https://www.chromium.org/developers/how-tos/run-chromium-with-flags Quote What's that profiling tool that you posted screenshots of? it hide in your dev tool : customize=>more tools=> Rendering => Frame Rendering Stats or with args "chromium-args": "--show-fps-counter" Edited January 28, 2021 by jonforum Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.