Mobile app version of vmapp.org
Login or Join
Moriarity648

: Alternatives to jQuery for simple, backwards compatible, client-side website animations? I was recently looking for an alternative JavaScript animation library, because for the few simple animations

@Moriarity648

Posted in: #Animation #Javascript #SoftwareRecommendation #WebsiteDesign

I was recently looking for an alternative JavaScript animation library, because for the few simple animations I wanted, a ~200kb jQuery library is not the best option.

After a bit of searching, I found GSAP, and implemented it successfully (and smoother) than the jQuery animation I had previously created. It weighs in at around 80kb - so still not perfect (but that's with additional plugins to be able to use CSS selectors, if you animate an SVG you can probably omit the 60kb required file).

I'm wondering if there are any other great options available.

Does anyone know of alternative libraries for animating elements with JavaScript?

The best options:


Do not rely on jQuery!
Either does not rely on CSS3 Keyframes or has a fallback for when CSS3 Keyframes are not available (for backwards compatibility)
Has minimal file-size and requires few or no other files to be included
Is not too complicated to learn! (either good documentation, or familiar/simple syntax - I don't want to spend days constructing a simple animation)


I'm not interested in Flash at all.

10.02% popularity Vote Up Vote Down


Login to follow query

More posts by @Moriarity648

2 Comments

Sorted by latest first Latest Oldest Best

 

@Nimeshi706

Your question is an incredibly broad one. The best animation library for your project is dependent on what you're doing in that specific project. The optimal library would be a custom one designed specifically for the project, but of course that doesn't answer your question here.

The two best general JavaScript animation libraries in my opinion at the moment are Velocity.js for most basic animations including many UI ones and GSAP (GreenSock Animation Platform) for more intricate ones. GSAP has a lot of additional addons that you can add depending on what the project requires. Both have good documentation and are pretty easy to get setup with.

Since you mentioned SVG specifically, I've found that I don't need an animation library at all for the animations I've done with it, SVG animations and CSS3 are well supported. But if you do for some reason, Snap.svg is one of the better ones.

However, JavaScript animation isn't always the best way to animate your project. I wrote a detailed answer that delves into when and how to use the different animation techniques available to us currently that is worth you reading.

10% popularity Vote Up Vote Down


 

@Merenda852

As you said, this question belongs here because animation is within the realm of graphic design. Similarly, Animation should also belong to the realm of CSS. I highly recommend Animate.CSS

Here's another interesting framework that just uses JS for only firing the animation during an event, like you mentioned. motorcortexjs.com/
Hi5 for not being interested in Flash!

10% popularity Vote Up Vote Down


Back to top | Use Dark Theme