ShadowGenerator causing rendering artifacts in Safari 15.4

Since the update to Safari 15.4, scenes using a ShadowGenerator seem to be causing rendering artifacts. When you drag a mesh around or move the camera, each frame of the animation stays on screen.

Playground: https://playground.babylonjs.com/#11YRJ0#2

Probably related to Broken rendering in gltf models with transmission on safari 15.4 on M1/iOS devices? - #10 by sebavan are you on M1 ?

I am trying to fight the good fight on webkit bug tracker at least


The bug reports are beginning to flood in various Babylon features broken in 15.4. Thousands of devs rely on this library for commercial projects, would be good to fix ASAP :/

@sebavan Something like this happened before and in Three(and prob babylon?) I remember manually had to clear some gl buffers until safari had it fixed. Any possibility of something like that here?

Good news is that it does not seem to repro on iPad Pro M1

Oh wait, I’m not on 15.4 yet

Let me install it first

Could you try this https://playground.babylonjs.com/#RLBZPF#9 to see if that works around it ?

1 Like

Ok so it works on iPadOS 15.4

1 Like

On my iPhone 12, still seeing the same issue :frowning:

If this helps, defining DefaultRenderingPipeline fixes the artifact drag issue, but does weird things to the coloring:

1 Like

Please try to disable “WebGL via Metal” option

That does work, thanks! Will that be Babylon’s official recommendation? Just wondering if that’s what we need to convey to users.

Unfortunately, there are no code workaround that I can find as it sounds deeply related to the Safari code itself :frowning: so at the moment there are no better alternatives, I really hope they ll fix it soon

Just in case: same workaround with disabling anti-aliasing as in Possible upcoming iOS 15.4 bug - #21 by sebavan works here (see https://playground.babylonjs.com/#11YRJ0#7)

1 Like

Thanks a ton @alvov, I completely missed adding it to this thread.