Jump to content


Combining GSAP source files into one file

Warning: Please note

This thread was started before GSAP 3 was released. Some information, especially the syntax, may be out of date for GSAP 3. Please see the GSAP 3 migration guide and release notes for more information about how to update the code to GSAP 3's syntax. 

Recommended Posts



If I use tweenmax and a couple of the plugins on a site - is it possible to combine all the 3 source scripts (for instance. tweenmax, cssrule plugin, drawSVG plugin) into one file to save on load times / http requests?

If so how would I go about doing this, would I just cut & paste the code from all 3 un-minified files into one file, and then minimise the combined file?  At the moment I'm just using tweenmax (which i then link to my main.js file for when I add tweens etc obviously)

Or is this just a bad idea all round?


Link to comment
Share on other sites

You could do that, but I'd recommend a CDN so you'll get the benefit of caching. You could use a CDN for TweenMax and the CSSRule plugin since they are not Club bonus files. DrawSVG is a Club member plugin so there isn't a CDN. You'll have to host that one yourself. More Club info:




Happy tweening.


  • Like 3
Link to comment
Share on other sites

Using a CDN is good choice. All your other scripts can be concatenated and minified into a single bundle/file.  I don't want to get into the details, but there a lot of tools that will automate this process for you, like Gulp and Webpack. Just search around. 

  • Like 4
Link to comment
Share on other sites

I learned from Blake, that jsDelivr will provide combined, CDN-hosted files for you. So if you want a file with TweenMax and CSSRulePlugin the link would be:




If you want to host the files yourself you could just click on that link and grab the source.

You won't find members-only plugins there like DrawSVG though.


You can build your own GSAP bundle here: https://www.jsdelivr.com/?query=gsap (it seems they are little stale with only having version 1.19.1)


As Blake mentioned above, using a CDN is really the best route as TweenMax from the cloudfare cdn is used so pervasively across the web (websites and ads) that there is a ridiculously high likely hood that it is already cached in the user's browser. 




  • Like 3
Link to comment
Share on other sites

Thanks that was all really useful info.


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.