MrTwister

Thanks Jack! This is how the function looks like in GSAP 3: const throttleAnimation = (animation, fps) => { let frame = 0 const ticker = gsap.ticker, time = ticker.time, frameLength = 1 / fps, update = function () { const newTime = ticker.time - time, newFrame = ~~(newTime / frameLength) if (frame !== newFrame) { frame = newFrame animation.time(newTime) if (animation.progress() === 1) { ticker.remove(update) } } } animation.pause() ticker.add(update) }

You also need to register the PIXI import: import * as PIXI from 'pixi.js' import PixiPlugin from 'gsap/PixiPlugin' PixiPlugin.registerPIXI(PIXI) (https://github.com/greensock/GreenSock-JS/issues/305)

Very interesting, thanks for the article! But I'm currently working on a DOM animation with lot's of random tweens and it massively improved performance on Safari and Firefox.

When animating DOM elements, adding will-change: transform to the most resource intensive ones can provide a significant performance boost. https://developer.mozilla.org/de/docs/Web/CSS/will-change