Jump to content
GreenSock

Search In
  • More options...
Find results that contain...
Find results in...
a-c-sreedhar-reddy

Performance diff between updating value via timeline vs via onUpdate

Recommended Posts

Hi,

 

would there be any performance difference between the below two codes?

 


gsap.to(element, { x: 5, duration: 1000})

 

 

vs

 

let value = { x: 0};

gsap.to(value, {x:5, duration: 1000, onUpdate: ()=>{ element.x =value.x } }, 

 

 

Link to comment
Share on other sites

The first option should be faster as it has less function calls and object read/writes.

 

Not saying the are no use cases for the second option, but performance isn't one of them.

 

 

 

  • Like 1
Link to comment
Share on other sites

yeah would that cause a noticable performance difference? currently I use PIXI with gsap and the task in request animation frame takes more time resulting in janking.

Link to comment
Share on other sites

1 hour ago, a-c-sreedhar-reddy said:

yeah would that cause a noticable performance difference? currently I use PIXI with gsap and the task in request animation frame takes more time resulting in janking.

No, not unless you're doing thousands of simultaneous animations but even then I kinda doubt you'd actually notice a difference. If you see jank, it is almost always because of graphics rendering, not GSAP updating properties. For example, GSAP updating values may account for 1% of the overall load (probably less) whereas graphics rendering and other overhead eats up the rest. So even if you made your GSAP-based code 10 times faster (and there's no way you would), you'd still see less than a 1% overall benefit. See what I mean? 

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
×