Flickering of overlapping meshes at Chrome on mac

Hi Everyone,

recently we started having some flickering/blinking issues on most of our products. As we confirmed it’s issue with Chrome at m1 and further macs.
We already saw chrome bug being reported for this so we added some more details there and we wait for browser fix.

While the issue doesn’t affect all of our users (even on m1 macs it’s like lottery. It’s hardly visible for some and blinking all the time for others. Also depends on screen size) it’s still something we would like to workaround. So we are looking for some way to limit (ideally remove) this flickering even if it means some quality dropping.

We are aware that this bug is mostly related to depth, and happen in places where multiple meshes overlap. We tried few things like disabling depth (breaks more things than fix), enabling depth pre pass (it’s blinking like xmass tree) or setting rendering groups for overlapping meshes. But the thing is that all of these solutions seems to require us to apply them manually per product and cannot be used globally. Doing it manually would be fine for 5 or 20 products but not for few thousands.

That’s why we would like to ask if maybe there is some way, we are unaware of, to overcome it which will not require us to change all products manually…

Below examples how does it behave

ac5328800d5c490182c9108be0c02d6c-ezgif.com-video-to-gif-converter (1)
b56824d767534824bebc06461d9c7e7a-ezgif.com-video-to-gif-converter (1)

I also add playground with scene reproduction, but it use different model compared to our app (exported from rendered scene rather than raw ones like in app. But it’s troublesome to load all materials etc.). On this model it seems to be less severe but still possible to spot.

We opened a bug on the Chromium side so please feel free to add your own repro there.
After the last Chrome update, I noticed blinking when I hovered over tabs [376174085] - Chromium

2 Likes

Hi Deltakosh,
Thank you for your reply.

We are actively participating in the Chromium thread regarding this issue. It appears that the Chromium team is making progress toward a fix. In the meantime, we are curious if there are any workarounds we can implement within Babylon.js to mitigate the flickering.

We would greatly appreciate any suggestions or recommendations you might have to help prevent this flickering issue.

1 Like

Unfortunately I cannot provide guidance as I do not repro (I’m on a PC :frowning: )

Thank you for the information.

We have diagnosed that enabling the #skia-graphite option in Chrome resolves the flickering issue. Since this option controls Chrome’s rendering engine and is utilized for specific functionalities within Babylon.js, I am curious whether it’s possible to implement a workaround within Babylon.js settings to prevent this bug from occurring.

Any insights or suggestions you could provide on this matter would be greatly appreciated.

I THINK skia is related to text rendering. Do you use GUI or any text related features?