
Show HN: Anime.js – Polyvalent JavaScript Animation Engine - JulianGarnier
http://anime-js.com/
======
JulianGarnier
This is a javascript animation library that I made and used on my latest
projects. The source and documentation are on Github. Feedbacks are welcome!

~~~
tlrobinson
What does "polyvalent" mean in this context?

~~~
JulianGarnier
Can works with CSS / SVG / Canvas animations

~~~
nekopa
I would like to add to the other comments, in that I had no idea what
polyvalent meant too.

I am going to make a wild guess in the dark here, and say that English isn't
your first language (I sincerely apologize if I'm wrong). If this is true, did
you try to translate a word from your native language into English, or are you
a chemist ;)

I know exactly what you're trying to say with the term, but I think you could
have much better uptake of your software if you found a word which conveys
what you want to convey to a programmer audience.

After looking at the etymology of the word and your explanation of what it
means, may I humbly put forward a couple of alternatives, and I am sure HN
users could contribute more:

Anime.js is a multi-target yet lightweight Javascript animation library.

Anime.js is a flexible yet lightweight Javascript animation library.

Anime.js is a multi-framework yet lightweight Javascript animation library.

Anime.js is a polygamous yet lightweight (and STD free!) Javascript animation
library.

The last entry is a feeble attempt at humour.

P.S. Great job on the library, especially keeping it lightweight

~~~
franciscop
As a Spaniard myself, I am baffled since it is a word kind of common in the
sciences. I don't think it's a translator problem, it might be a false friend
problem; in Spanish it's "polivalente" instead of "polyvalent"

I would say that, from knowing the Spanish meaning AND use, there is no
"decent" translation since it can be precise or simple, but not both. But this
is the one I like most even though it has slightly different meaning:

\- Anime.js is a flexible yet lightweight Javascript animation library.

------
davnn
The sad thing with animation libraries is, at least in my opinion, that in the
end it comes down to a performance race.

I loved popmotion at first, but once you hit the first performance bottleneck
you can either contribute and fix performance issues yourself or choose a
different library (most likely not the hip, new one).

I do not want to convey the message that people should stop creating animation
libraries, I think that innovation is great, but the road for such a library
to be useful in production is a long one.

~~~
KaoruAoiShiho
Have you tried popmotion after the latest update?

~~~
davnn
No I haven't. Did not work on animations recently, but I may check it out
again in the future!

------
trollboll
Very nice but it explodes my work laptops CPU (running ubuntu 16.04 + chrome
50) even just idling on [http://anime-js.com/](http://anime-js.com/)

Im guessing you need to add some "sleep" somewhere

~~~
guessmyname
Jesus! I had to force-kill my browser after a tab (didn't know which one at
first) started eating all my 6GB of RAM, then realized it was this one when I
restored the session. I almost reboot my computer entirely if it wasn't
because I was doing something important in the Terminal. One would assume that
posting a link in this website would be after some testing of the link in
itself. I guess I will need to be extra careful when clicking shared links,
specially if they have JS in the URL.

    
    
        Linux 3.16 (amd64)
        Google Chrome 52.0.2743.41 beta
        Four other tabs open, five with this "anime-js.com"

~~~
ghostly_s
No need to be dramatic. The site nor the Codepens have any unduly high impact
on _my_ work machine, an underpowered Windows 7 machine with Chrome Version
51.0.2704.103 m (64-bit). Just because you encountered a bug in your setup
doesn't necessarily imply the author has exhibited reckless abandon in testing
this project.

~~~
TeMPOraL
Maybe the low resource usage on _your_ work machines is actually a bug in
_your_ setup?

Honestly though, GP's setup looks pretty ordinary. It's probably a Chrome
implementation bug, and the library author didn't put _enough_ hacks into his
product to work around the brokenness of the browser platforms.

------
snarkyturtle
What's the difference between this library and the Web Animations API?
[https://developers.google.com/web/updates/2013/12/New-Web-
An...](https://developers.google.com/web/updates/2013/12/New-Web-Animations-
engine-in-Blink-drives-CSS-Animations-Transitions)

~~~
tbranyen
Web Animations have barely any browser support, a pretty crummy API (IMO), and
the Promise `finished` property which would differentiate itself from this
library has still not been implemented anywhere yet :-/

~~~
JulianGarnier
+1

------
michaelbuddy
I'd like to see a visual animation editor that exports to this or greensock.
You'll have some very happy designers at that point. I think theres also
somewhat of a barrier to getting animations to be responsive. Maybe it's a
good think js / html5 animation is hard still though. Keeps the web from being
too kooky. Keeps bad ideas somewhat more at bay.

~~~
ry_ry
Oh I dunno, virtually every evolution of the web has been a reaction to what
came before being roundly abused.

Sometimes it takes following an approach to its illogical conclusion to
recognise what needs fixing.

I like to think of it as destructive testing of the medium ;)

------
KaoruAoiShiho
How is this better than greensock / mo.js / popmotion.js?

~~~
instakill
I deplore this kind of question. What value does this bring to you to ask it?

~~~
JungleGymSam
Read it with an inquisitive tone, rather than a snarky one, and your emotions
won't flare up.

~~~
instakill
I did. This question still adds no value to the discussion.

------
Secretmapper
Totally awesome work! It would be great to get some comparison tables (size,
compatibility, speed) for the common animation libraries (velocity,
tweenmax/lite, etc)

Also digging your personal site!

------
sriram_malhar
The library looks really nice. It works great in Chrome, but the following SVG
path animation does not on Safari (8.0.7), MacOS X (Yosemite, 10.10.4).

[http://codepen.io/juliangarnier/pen/dXNgVB?editors=0010](http://codepen.io/juliangarnier/pen/dXNgVB?editors=0010)

Anyone else have this problem?

~~~
threefour
It's working for me: MacBook with 10.11.5 and Safari 9.1.1.

------
gt5050
This looks great. Thanks for posting this.

Is there a way we could export these animations as a gif ?

~~~
JulianGarnier
No, but you can record your screen using an app like Licecap (that's what I
did for the documentation)

------
beefsack
Awesome project and impressive demo, but these ambiguous project names are a
really bad idea for a number of reasons.

------
drdeca
I'm confused. What does this have to do with anime/why is this called anime?

~~~
JulianGarnier
"Anime (Japanese: アニメ), is Japanese hand-drawn or computer animation. The word
is the abbreviated pronunciation of "animation" in Japanese, where this term
references all animation."
[https://en.wikipedia.org/wiki/Anime](https://en.wikipedia.org/wiki/Anime)

~~~
JungleGymSam
To be fair, anime is a loaded term that _pretty much_ means one thing.

------
surkin
Impressive.

