SAFARI 15.2 WEBGL performance disaster

recent switcher, I bought a Mac Pro M1 on November 11 and try one of my webgl prog that run fast in Safari.
Some days later, Safari goes slow and I go back to others nav.
I decided to wait next Mac OS release which happens for me yesterday December 12 : version 12.1 Monterey.
Now safari is 15.2 and new tests show a disaster :
A simple move on screen with P5.js of an obj model takes :
7,381s on Chrome, 7,447 s on Edge, 7,330 s on Brave and ... 32,598 s on Safari !
I supposed one day that can comes from external monitors ( I work on a high canvas ), but last tests were done with a reduced 800x800 canvas on computer screen . So wrong path.

is this a known problem ?

thanks

Post not yet marked as solved Up vote post of pirla Down vote post of pirla
4.6k views
Posted by
pirla
Reply

  • It has been like this for ages ... Deplorable

    —
    Numerized
Add a Comment

Replies

WebGl on Safari Monterey is a disaster. It's a disaster too on iPads last gen......

Posted by
Numerized
Post not yet marked as solved Up vote reply of Numerized Down vote reply of Numerized
Add a Comment

Seeing the same issue here. Our test scene used to render at 60fps back in April 2021, now without changing any code it's at 2FPS and my whole Macbook Air freezes.

Test scene: https://test.looc.io/forest/index.html

Posted by
Bersaelor
Post not yet marked as solved Up vote reply of Bersaelor Down vote reply of Bersaelor

  • Thanks for the test scene! It also almost freezes my entire machine (M1 Pro). But if I disable WebGL 2.0 under experimental features, it's back to 60 FPS again. So, there seems to be a bug with WebGL 2.0.

    —
    fabioarnold

  • Thanks for the test scene. I can confirm this bug still exist on Safari 16.1 on Ventura 13.1.1 on M1 MBA

    —
    kokorabashi
Add a Comment

Any progress on that issue? Or workarounds? 🤔

Posted by
mysticdeveloper
Up vote reply of mysticdeveloper Down vote reply of mysticdeveloper
Add a Comment

Following your question, i redo a test on my p5.js application.
I have a watcher in the main loop of my app to detect slow-down.
I set its threeshold at 50 Fps.
On my splash screen webgl displaying a (rather big) plane with a texture:

  • Chrome stays at 50 and give very rarely some 48, 49 fps.
  • Safari stays permanently under 11 fps

workaround : download chrome, brave or firefox....

HTH

Posted by
pirla
Post not yet marked as solved Up vote reply of pirla Down vote reply of pirla
Add a Comment

In case anyone else lands here via Google.

The slowdown I've seen is most severe when WebGL 2.0 is enabled.

So if you are in developer mode in Safari you can go to "Develop" -> "Experimental Features" -> untick "WebGL 2.0".

This will significantly improve performance if the page you're trying to view also supports webgl 1.0 (as the demo page posted by Bersaelor does).

Still nowhere near Firefox or Chome performance, but still a 20x improvement in frametime for me in Safari comparing with and and without WebGL 2.0 enabled.

Posted by
Bigpet
Up vote reply of Bigpet Down vote reply of Bigpet
Add a Comment

This bug is still reproducible on Ventura 13.1.1 and Safari 16.1.1 5 months later. I was wondering if this bug is relating to Apple's implementation of WebGL via Metal. I did an experiment that I run Bersaelor's test scene: https://test.looc.io/forest/index.html on Chrome 107 with metal as ANGELS backend. At last it's still with a freezing screen and 1-2 FPS on my M1 laptop. It seems that it's a Metal bug, and less relevant to WebKit.

Posted by
kokorabashi
Up vote reply of kokorabashi Down vote reply of kokorabashi

  • The problem still persists. Maybe got worse in 13.1. Safari Tech Preview is even worse! Do any of you have a good webgl 1 and 2 performance test we can try. I wonder if I adapt my tools to use webgl 2 I will get better performance.

    —
    filipinascimento

  • I did an experiment to turn off the 'WebGL via Metal' and webGL works like magic. If you turn on develop mode in Safari you can go to safari's menu and follow "Develop" -> "Experimental Features" -> untick "WebGL via Metal".

    —
    aorticstenosis
Add a Comment