WebGL 2 Support

[babdev]

Hello BJS devs,

What are BabylonJS's plans for WebGL 2 support? Namely, how do you guys envision supporting webgl 2 and backwards compatibility?

I'm not super experienced with game development but I've been playing around with a toy project and I need to use binary 3D textures. I've made some changes to BJS to support 3D textures but I'm not familiar enough with the codebase to think this is the correct way of doing this. https://github.com/BabylonJS/Babylon.js/compare/master...wongwill86:texture3d?expand=1 

Any feedback is much appreciated and I would be happy to make changes / open a PR if this seems like the correct approach. Also, if there is already a branch that supports this correctly, that would be even better

Thanks!

[aWeirdo]

 

[babdev]

I meant, how should babylon handle browsers that don't support WebGL 2 yet, i.e. should babylon indescriminantly call gl.texImage3D, gl.RGBA8UI, etc... and fail or should there be extra protection for the browser to handle it?

I also need MultiRenderTargets so I might need to take a look at that too...

[davrous]

Our shader architecture is taking care of that. It will try to target WebGL 2 and if it's doesn't work switch to WebGL 1. @Deltakosh and @Sebavan can elaborate on the job they've done to make it transparent to our users. 

[GameMonetize]

When babylon.js is initializing it does the following things:

- Try to get a webgl2 context and fallback to webgl1 if webgl2 is not available

- Try to acquire as much extensions as possible. When no extension is available for a feature, bjs provides a fallback or turn off the feature (bump for instance)

-If webgl2 is available shaders are compiled using the new GLSL language (and we update dynamically the shaders written using previous version)

[PeapBoy]

Hi folks,

I'm wondering about how and when you're updating the shaders to "300 es" version.
I see that you add the "#version 300 es" line at the top of the shaders but it's not enough and I don't understand where you're updating the shaders ?

Btw, does this "update" parse shader code and replace extension functions by the new ones ?
I mean, I have a bug with the texture LOD extension : when webGL 2 is enabled, texture2DLodEXT() function doesn't work anymore and has to be replaced by textureLod() function.
I just understood that today after debugging with many browsers on many devices.
A very strange behaviour is that textureCubeLodEXT works for 2D textures without any errors haha... But texture2DLodExt will always fail the compilation.

So to fix my bug, I just have to check the webGL version and use defines. But maybe I could do something better if I understand how you're updating the code ? ^^

Thanks

[GameMonetize]

Hello, this is done automatically for you right here:

https://github.com/BabylonJS/Babylon.js/blob/master/src/Materials/babylon.effect.ts#L279

For instance LOD is changed here:

https://github.com/BabylonJS/Babylon.js/blob/master/src/Materials/babylon.effect.ts#L307

 

From your point of view, you can either submit 200es shaders and babylon will convert them or you can directly send 300es

 

[PeapBoy]

Oh wonderful !!!

Thank you a lot, I already love it.

[EDIT]

Now I understand why it didn't work for me even since I was using Babylon 3.0 !
texture2DLodEXT is not replaced by textureLod. Only textureCubeLodEXT is.
https://github.com/BabylonJS/Babylon.js/blob/master/src/Materials/babylon.effect.ts#L307

Thanks for the help

Edit2 : It's ridiculous but I did my very first PR with that haha 

[RedMax]

I had a similar problem and finally figured out where the problem was. I just wanted to let everyone know:

My main method in the shader was declared like this "void main (void)" with a space between main and the bracket. So the conversion didn't catch it and it didn't include the definition for glFragColor.