[React] Targeting dom with useRef vs gsap.utils.selectors/gsap.context

[gsapguy]

Hello! I wanted to know in terms of performance if there's any difference between using multiple useRef to select the elements of a react component and using the new feature gsap.context.

Second if it's posibble I'd like to know what is it going on in the shadows, how is that the library makes sure that the strings I pass which are inside the parent ref are getting targeted. Is there somewhere I could read about it?

[Rodrigo]

Hi,

 

Performance-wise there shouldn't be any difference. It's just a more convenient way that saves users from creating a bunch of refs in their code, that's all. You can use refs if you want. We recommend using GSAP Context's selector abilities but don't enforce it as the only way of doing things.

 

14 hours ago, gsapguy said:

Second if it's posibble I'd like to know what is it going on in the shadows, how is that the library makes sure that the strings I pass which are inside the parent ref are getting targeted. Is there somewhere I could read about it?

Quite simple actually. GSAP uses a querySelectorAll method and that result is returned as an array:

https://github.com/greensock/GSAP/blob/master/src/gsap-core.js#L440-L447

 

Hopefully this clear things up. Let us know if you have more questions.

Happy Tweening!