# Horrible 3D/Three.js performance in latest Safari on macOS

**URL:** <https://discourse.threejs.org/t/horrible-3d-three-js-performance-in-latest-safari-on-macos/25940>\
**Category:** Questions\
**Tags:** safari, macos, performance\
**Created:** [May 4, 2021, 3:12pm UTC](https://discourse.threejs.org/t/horrible-3d-three-js-performance-in-latest-safari-on-macos/25940 "2021-05-04T15:12:11Z")\
**Posts on this page:** 20\
**Page:** 1

<div class="post-metadata">

**Author:** ![molzer](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/molzer/32/12347_2.png) [@molzer](https://discourse.threejs.org/u/molzer)\
**Post date:** [May 4, 2021, 3:12pm UTC](https://discourse.threejs.org/t/horrible-3d-three-js-performance-in-latest-safari-on-macos/25940/1 "2021-05-04T15:12:12Z")

</div>

I’m currently running Safari Version 14.1 (16611.1.21.161.6) on macOS 11.3.1 (20E241) and since about last week, our app ([https://app.shadowmap.org](https://app.shadowmap.org)) seems to run ridiculously slow on this config. I am pretty convinced it is caused by the latest update for Safari.

Other browsers including Brave and Firefox on the same machine/OS run still fine. Safari on iOS behaves as well as ever too.

Does anyone have infos about what happened to Safari? Maybe has an idea how to compensate/fix the performance drop?

---

<div class="post-metadata">

**Author:** ![Mugen87](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/mugen87/32/5645_2.png) [@Mugen87](https://discourse.threejs.org/u/Mugen87)\
**Post date:** [May 4, 2021, 4:15pm UTC](https://discourse.threejs.org/t/horrible-3d-three-js-performance-in-latest-safari-on-macos/25940/2 "2021-05-04T16:15:09Z")

</div>

Do you see this performance degradation with other WebGL apps, too? What about the official `three.js` examples? [three.js examples](https://threejs.org/examples/)

---

<div class="post-metadata">

**Author:** ![Fyrestar](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/fyrestar/32/52793_2.png) [@Fyrestar](https://discourse.threejs.org/u/Fyrestar)\
**Post date:** [May 4, 2021, 4:29pm UTC](https://discourse.threejs.org/t/horrible-3d-three-js-performance-in-latest-safari-on-macos/25940/3 "2021-05-04T16:29:30Z")

</div>

Like @Mugen87 said you should try track down the cause of the performance drop, the easiest way is starting with the official examples and possibly specific features you use that are also showcased in them, if everything works fine you can start isolating the issue by disabling features, reducing what you render or process.

Did you measured the performance yet?

---

<div class="post-metadata">

**Author:** ![molzer](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/molzer/32/12347_2.png) [@molzer](https://discourse.threejs.org/u/molzer)\
**Post date:** [May 4, 2021, 4:43pm UTC](https://discourse.threejs.org/t/horrible-3d-three-js-performance-in-latest-safari-on-macos/25940/4 "2021-05-04T16:43:49Z")

</div>

Very good point! I just tried some of the examples in Safari and – yes – they work significantly worse than some weeks ago. This even leads to the whole browser UI freezing, the machine becoming unresponsive. Again, same examples on the same machine in Firefox/Brave run perfectly smooth. Seems to be a bigger Safari issue.

A thought: `renderer = new THREE.WebGLRenderer({ powerPreference: "high-performance" });` – maybe this isn’t activated or something?

---

<div class="post-metadata">

**Author:** ![Mugen87](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/mugen87/32/5645_2.png) [@Mugen87](https://discourse.threejs.org/u/Mugen87)\
**Post date:** [May 4, 2021, 5:24pm UTC](https://discourse.threejs.org/t/horrible-3d-three-js-performance-in-latest-safari-on-macos/25940/5 "2021-05-04T17:24:23Z")

</div>

It’s best if you report the issue right here: [https://bugs.webkit.org/](https://bugs.webkit.org/)

Whether this problem is related to `powerPreference` or not is hard to tell. I mean you can try different renderer settings out and see if things improve. But it’s probably best if the devs from WebKit investigate the issue.

---

<div class="post-metadata">

**Author:** ![Lasse](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/lasse/32/18566_2.png) [@Lasse](https://discourse.threejs.org/u/Lasse)\
**Post date:** [May 28, 2021, 1:49pm UTC](https://discourse.threejs.org/t/horrible-3d-three-js-performance-in-latest-safari-on-macos/25940/6 "2021-05-28T13:49:57Z")

</div>

@molzer Did you ever find the culprit in safari? I’m seeing the same slowdowns on my machine for examples and other stuff too, but only in safari, both chrome and firefox are fine.

---

<div class="post-metadata">

**Author:** ![molzer](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/molzer/32/12347_2.png) [@molzer](https://discourse.threejs.org/u/molzer)\
**Post date:** [May 28, 2021, 2:17pm UTC](https://discourse.threejs.org/t/horrible-3d-three-js-performance-in-latest-safari-on-macos/25940/7 "2021-05-28T14:17:33Z")

</div>

No, unfortunately no update. Also Safari Technology Preview is even worse.  
I wonder whether it’s WebGL apps in general or only Three.js?

What machine do you have? On my side it’s a 2016 MBP with Radeon Pro 455 and integrated Intel HD 530 (doesn’t matter which one is active, the performance is a catastrophy).  
The other one is a 16" MBP.

---

<div class="post-metadata">

**Author:** ![Lasse](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/lasse/32/18566_2.png) [@Lasse](https://discourse.threejs.org/u/Lasse)\
**Post date:** [May 31, 2021, 8:15am UTC](https://discourse.threejs.org/t/horrible-3d-three-js-performance-in-latest-safari-on-macos/25940/8 "2021-05-31T08:15:08Z")

</div>

I have a 2019 16" MBP, AMD Radeon Pro 5600M 8 GB, I think it’s a software issue with safari 14, I’m running macOS 11.4, on older laptops in our company running safari 13, same demo runs fine. I found a few issues that may be related:  
[https://bugs.webkit.org/show\_bug.cgi?id=218949](https://bugs.webkit.org/show_bug.cgi?id=218949)  
[https://bugs.webkit.org/show\_bug.cgi?id=220846](https://bugs.webkit.org/show_bug.cgi?id=220846)

---

<div class="post-metadata">

**Author:** ![molzer](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/molzer/32/12347_2.png) [@molzer](https://discourse.threejs.org/u/molzer)\
**Post date:** [June 2, 2021, 1:31pm UTC](https://discourse.threejs.org/t/horrible-3d-three-js-performance-in-latest-safari-on-macos/25940/9 "2021-06-02T13:31:03Z")

</div>

Thanks for the links, @Lasse – it’s weird and fragmented. E.g., regarding `powerPreference`, on my MBP, the performance with the integrated GPU is now also far worse than before.

Irrelevant the active GPU, my computer starts freezing, even crashes sometimes when launching Shadowmap. It really feels like it has something to do with the “ANGLE” implementation. If you found a way out of this/hotfix, please share! 🙏

---

<div class="post-metadata">

**Author:** ![molzer](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/molzer/32/12347_2.png) [@molzer](https://discourse.threejs.org/u/molzer)\
**Post date:** [July 28, 2021, 3:12pm UTC](https://discourse.threejs.org/t/horrible-3d-three-js-performance-in-latest-safari-on-macos/25940/10 "2021-07-28T15:12:19Z")

</div>

I just tested the latest Safari Technology preview (15.0, R128) on macOS 11.5 and Shadowmap runs perfectly fine, maybe even faster! If that’s where this all is going, I’m happy and hope for fall …

 ![Bildschirmfoto 2021-07-28 um 17.08.54](https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/3X/e/f/efc280504defbea2a2d3c4bd699dbc5f854c6b96.jpeg)

On the other hand, some three.js demos are still super slow (e.g., [three.js examples](https://threejs.org/examples/#webgl_animation_keyframes)).

Any other updates from other people affected by this?

---

<div class="post-metadata">

**Author:** ![Lasse](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/lasse/32/18566_2.png) [@Lasse](https://discourse.threejs.org/u/Lasse)\
**Post date:** [August 5, 2021, 8:19am UTC](https://discourse.threejs.org/t/horrible-3d-three-js-performance-in-latest-safari-on-macos/25940/11 "2021-08-05T08:19:31Z")

</div>

The latest 129 preview release fixes the bug. The bug came from not respecting the request to use the discrete GPU it seems: [Release Notes for Safari Technology Preview 129 | WebKit](https://webkit.org/blog/11951/release-notes-for-safari-technology-preview-129/)  
[https://twitter.com/Supermoos/status/1423196071711363076](https://twitter.com/Supermoos/status/1423196071711363076)

---

<div class="post-metadata">

**Author:** ![molzer](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/molzer/32/12347_2.png) [@molzer](https://discourse.threejs.org/u/molzer)\
**Post date:** [August 5, 2021, 9:53am UTC](https://discourse.threejs.org/t/horrible-3d-three-js-performance-in-latest-safari-on-macos/25940/12 "2021-08-05T09:53:22Z")

</div>

Hallelujah 🙌

---

<div class="post-metadata">

**Author:** ![Lasse](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/lasse/32/18566_2.png) [@Lasse](https://discourse.threejs.org/u/Lasse)\
**Post date:** [September 8, 2021, 10:16am UTC](https://discourse.threejs.org/t/horrible-3d-three-js-performance-in-latest-safari-on-macos/25940/13 "2021-09-08T10:16:16Z")

</div>

Seems like the bug has re-appeared: [227408 – [macOS] WebGL content is unable to use the discrete GPU](https://bugs.webkit.org/show_bug.cgi?id=227408)

---

<div class="post-metadata">

**Author:** ![molzer](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/molzer/32/12347_2.png) [@molzer](https://discourse.threejs.org/u/molzer)\
**Post date:** [September 8, 2021, 12:02pm UTC](https://discourse.threejs.org/t/horrible-3d-three-js-performance-in-latest-safari-on-macos/25940/14 "2021-09-08T12:02:42Z")

</div>

🙃  
not cool, thanks for the update @Lasse

---

<div class="post-metadata">

**Author:** ![molzer](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/molzer/32/12347_2.png) [@molzer](https://discourse.threejs.org/u/molzer)\
**Post date:** [September 23, 2021, 2:07pm UTC](https://discourse.threejs.org/t/horrible-3d-three-js-performance-in-latest-safari-on-macos/25940/15 "2021-09-23T14:07:43Z")

</div>

Just upgraded to Safari 15 on macOS 11.6 and the performance is still bad. Just confirming the Technology Preview’s trajectory. Unfortunately.

---

<div class="post-metadata">

**Author:** ![geet](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/geet/32/24713_2.png) [@geet](https://discourse.threejs.org/u/geet)\
**Post date:** [March 4, 2022, 8:09pm UTC](https://discourse.threejs.org/t/horrible-3d-three-js-performance-in-latest-safari-on-macos/25940/16 "2022-03-04T20:09:15Z")

</div>

reporting from march 2022, still terrible performance. it is very annoying to say the least.  
tried shadowmap and my own project along with the examples in the docs. chrome just has more than double the framerate. very weird

---

<div class="post-metadata">

**Author:** ![molzer](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/molzer/32/12347_2.png) [@molzer](https://discourse.threejs.org/u/molzer)\
**Post date:** [March 4, 2022, 8:22pm UTC](https://discourse.threejs.org/t/horrible-3d-three-js-performance-in-latest-safari-on-macos/25940/17 "2022-03-04T20:22:47Z")

</div>

Oh really? The problem disappeared after upgrading to macOS 12, Monterey. Make sure to have the “Experimental Features”:

- WebGL 2.0
- WebGL via Metal

enabled.

Runs super smooth since then.

---

<div class="post-metadata">

**Author:** ![Mugen87](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/mugen87/32/5645_2.png) [@Mugen87](https://discourse.threejs.org/u/Mugen87)\
**Post date:** [March 5, 2022, 8:35am UTC](https://discourse.threejs.org/t/horrible-3d-three-js-performance-in-latest-safari-on-macos/25940/18 "2022-03-05T08:35:39Z")

</div>

With latest iOS and macOS enabling WebGL 2.0 in Safari should not be necessary anymore since it is enabled by default.

---

<div class="post-metadata">

**Author:** ![geet](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/geet/32/24713_2.png) [@geet](https://discourse.threejs.org/u/geet)\
**Post date:** [March 6, 2022, 4:42pm UTC](https://discourse.threejs.org/t/horrible-3d-three-js-performance-in-latest-safari-on-macos/25940/19 "2022-03-06T16:42:03Z")

</div>

that’s actually the first thing I checked before posting here and both were enabled (as @Mugen87 pointed out). Including GPU process: canvas rendering and WebGL. All on macOS  
kinda sad but I lowkey have given up trying, working pretty well on chrome, almost triple the frame rate and loading speed. I will test it out later on a retired iPhone X sometime later.

---

<div class="post-metadata">

**Author:** ![Mike\_D](https://avatars.discourse-cdn.com/v4/letter/m/22d042/32.png) [@Mike\_D](https://discourse.threejs.org/u/Mike_D)\
**Post date:** [May 20, 2022, 10:05pm UTC](https://discourse.threejs.org/t/horrible-3d-three-js-performance-in-latest-safari-on-macos/25940/20 "2022-05-20T22:05:31Z")

</div>

Not sure if this is the same issue coming back to haunt us, vs. a new one, but I’ve run into a situation where Safari is using the integrated GPU instead of the dedicated GPU: [Horrible Safari Performance - #2 by Mike\_D](https://discourse.threejs.org/t/horrible-safari-performance/38364/3)

[Next page](https://discourse.threejs.org/t/horrible-3d-three-js-performance-in-latest-safari-on-macos/25940.md?page=2)