Horrible jaggies on reflectionTexture when microSurface < 1

[httpfiles]

Hello everyone, recently I'm confused with our PBR System, wishing get some help here,  my problem below:

 

This is the different glossiness effects in PHYSICALLY-BASED RENDERING, AND YOU CAN TOO!  by Marmoset

This is the PBR Glossiness Demo in Playcanvas.

This is BabylonJS PBR MicroSurface Demo:

See the jaggies when Glossiness <1 or Microsurface < 1? But in the other PBR Systems there's only a smooth bluring gradient

In almost mobile browser it's even showing horrible mosaics, like this:

What happened? And how to avoid it ? Or there's something wrong with our PBR Theory?

Thank you very much!

[GameMonetize]

Ping @Sebavan

[Sebavan]

Hello,

Could you highlight in the following PG the problematic ones ? and are you using an HDR texture ?

http://www.babylonjs-playground.com/#ZGQXVX

[httpfiles]

Hello, @Sebavan , here is our test result:

 

iOS 10.3.1 + Chrome 57,  The problem only takes place with HDRCubeTexture but not CubeTexture.

 

On PC, this is a similar sphere in the other PBR system:

and this is in our system:

 

Above all ,  the effect of 'Glossiness/Microsurface < 1' on PC is nearly acceptable, but on mobile browsers which is not quite correct.

[Sebavan]

Yep this is a known issue we ll address pretty soon (upcoming couple of months).

currently your best bet on ios or mac is to use preprocessed cube map like here:

http://www.babylonjs-playground.com/#ZGQXVX#1

A good explanation of the issue is available here:

https://doc.babylonjs.com/overviews/physically_based_rendering_master#seamless-cubemap

I let you know as soon as we have a better way to adress the blur.