High CPU usage on Safari with GSAP ScrollTrigger even when idle

[hug0]

I copied some example code from the GSAP documentation to see if it had the same performance issue I’m experiencing in my own project, and it does. The CPU usage stays at around 43% or higher, even when I’m not interacting with the page at all.

 

After looking into it, it seems like some repainting or reflows are being constantly triggered, possibly by ScrollTrigger’s requestAnimationFrame loop.

 

Has anyone else encountered this issue?
Is there a way to prevent unnecessary updates or reduce the CPU usage when the page is idle?

I'm using Safari Version 18.4 (20621.1.15.11.10), and the GSAP version 3.13.0

 

Thanks in advance for any help or insights!

 

Code example:

https://stackblitz.com/edit/gsap-bug-test1?file=index.html

 

Profiler: 

 

[Rodrigo]

Hi,

 

I think this could be related to including screenshots in the Timeline recordings in Safari. I don't normally allow that neither on Chrome nor Safari and here is how that looks like:

Test without the screenshots and see if that changes anything. Is worth mentioning if the CPU consumption was 43% with no interaction, probably we'd be out of business a long time ago 😅

 

Happy Tweening!

[hug0]

Yes, I thought this was a bug with Safari itself, not with GSAP. It’s kind of silly that screenshots count toward the performance metrics  in Chrome and Firefox, the measurements are fine even with screenshots enabled.

My bad, and thanks anyway! Sorry for bothering you with something so minor.

[Rodrigo]

I'm no expert on the subject but my guess is that the profiling tool just measures how much CPU that particular browser tab is consuming, since the devtools are associated with the tab the usage from it also counts, but this is just me guessing and nothing more.