Hi all, not new to GSAP (love it) but I typically don't repeat or yoyo my animations and I'm wondering why my computer is chugging so hard from this relatively simple animation — am I missing something or is there a better way to set this up? I tried grouping the spheres into containers to reduce the amount of overall animations but that didn't seem to help (much, at least).
const homeMarqueeSpheres = gsap.timeline({ paused: true, yoyo: true, repeat: -1 });
homeMarqueeSpheres
.to('.marquee--home__sphere--one', {duration: 4, y: 60, ease: 'sine.inOut'}, 0)
.to('.marquee--home__spheres-container--two-four-five-nine', {duration: 4, y: 40, ease: 'sine.inOut'}, 0)
.to('.marquee--home__spheres-container--three-six', {duration: 4, y: -40, ease: 'sine.inOut'}, 0)
.to('.marquee--home__spheres-container--seven-eight-ten', {duration: 4, y: -25, ease: 'sine.inOut'}, 0)