paol-imi

Yes, this clarifies all my doubts. Thanks for the detailed answer.

Thank you! I like the general concept of contexts, but I don't think I fully understand some things. revert() applied to a Tween should reset its initial CSS, but the docs says that revert() applied to a context also kill() its Tweens: The implicit kill() seemed confusing to me. I searched into the source code and did some tests, and it seems that context.revert() does Not destroy the animations. I would definitely prefer this behavior, but if my tests are correct, the demo you linked (and the one in the docs) might have a memory leak since kill() is never called. AFAIU, the context is just an utility for managing groups of animations, and the only mandatory part for the React integration is to kill() the animations inside the effects cleanup function (eventually revert().kill() if the element is reused). What I don't understand is why the context function also accepts a React ref. From the source code it looks like just a shortcut for ref.current, but it doesn't seem right that GSAP is somehow aware of some React specific APIs. I hope this is the right thread to discuss this, and by the way thank you all for the fantastic work you are doing with gsap!

Hi all, I've been working on a tool to integrate React with libraries like this one, with the aim of managing internally all the complexity and hidden pitfalls (especially with React 18). This work started because I needed gsap in my React app, and in fact, I used it for the examples in the documentation. Those interested can find the examples with gsap and gsap/draggable, with the codesandbox links. The project can be found on Github. I released this tool today, the documentation and testing should be quite solid but it should be treated as a pre-release. Feel free to open a discussion if you want to try it out and need help. Cheers