Unsure about what happens with WebGL/Babylon when Browser hardware acceleration not available

Hi,

My Babylon is @ https://michaelzfreeman.org/

On my browser there’s sometimes a problem - How to Re-enable Hardware Acceleration on Microsoft Edge Browser Dev Linux – Michael Z Freeman

How is Babylon able to run at at all without the GPU available ? When it’s not it seems to go into some kind of software mode. FPS low, CPU high. Is this actually a feature of WebGL ? I’m trying to understand all this as I believe some users may be getting a bad experience on low spec devices when there’s no GPU or access to GPU is turned off in the browser. The Babylon on my page is pretty simple …

But nevertheless I’d like to develop some way of handling devices that don’t have hardware acceleration. Cheers.

Hey this is actually a browser feature where WebGL is displayed through a pure software driver. There is an hint in bjs that will let you know that hardware acceleration is off

EngineOptions | Babylon.js Documentation (babylonjs.com)

1 Like

Ah, yes ! Thanks …

failIfMajorPerformanceCaveat

Will prevent the system from falling back to software implementation if a hardware device cannot be created

If I can test for that test failing somehow then I can replace the Babylon canvas with a video or image.

Is this the setting you meant ? When you said “hint” I was imaging some warning that would come up for the user.

Yes this is exactly what I meant :slight_smile:

1 Like

So performance problem solved. I looked deeper into this and it looks like with something as simple as my rotating cube carousel its simpler and better performing to use CSS transform and rotate3d. When I started to develop my carousel a few years ago I don’t think CSS transforms (the 3D one’s that use the GPU) were as stable and well developed as they are now. Is there any reason that Babylon might actually perform better in some circumstances ?

well as soon as you want more than a simple box probably ;D

Yes, lol :smile:, well it’s technically a carousel - Carousel · Intro to CSS 3D transforms … I have not tested yet if CSS transform can handle the video part of it as one face has an animated video texture.