Live data from Hacker News

Anime.js – A lightweight JavaScript animation library

animejs.com

21–30 of 133 posts

Re: Anime.js – A lightweight JavaScript animation library

#21
Mostly obsolete with CSS tweening.

You can do non-blocking animation timelines without any library if you use async javascript.

  
  
  Click me to change color every second, then remove.
    
      // Locality of Behavior
      me = document.currentScript.parentElement;
      me.addEventListener("click", async event => {
        me = event.target
        me.style.transition = "background 1s"
        await sleep(1000)
        me.style.background = "red"
        await sleep(1000)
        me.style.background = "green"
        await sleep(1000)
        me.style.background = "blue"
        await sleep(1000)
        me.style.background = "none"
        await sleep(1000)
        me.remove()
      })

      const sleep = ms => new Promise(r => setTimeout(r, ms));
    
  
  
  
If you like this, you may also want to check out: https://github.com/gnat/surreal

Re: Anime.js – A lightweight JavaScript animation library

#22
post #21

Mostly obsolete with CSS tweening. You can do non-blocking animation timelines without any library if you use async javascript. Click me to change color every second, then remove. // Locality of Behavior me = document.currentScript.parentElement; me.addEventListener("click", async event => { me = event.target me.style.transition = "background 1s" await sleep(1000) me.style.background = "red" await sleep(1000) me.styl…

Isn't the WebAnimations API available in modern browsers?

Re: Anime.js – A lightweight JavaScript animation library

#23
post #18

Earlier quoted context omitted.

literal meaning and widely accepted use meaning do not always align. if I said Anime, would you think Tiny Toons, Family Guy, Toy Story, or Lion King? Or would you think DBZ, Akira, One Piece, etc?

To be fair the library name may be based on Japanese usage, where the term just means anything animated (including all the works you mentioned).

It's like the discussions about manga/manhua/manwha we keep return to, when they're all literally the same word with the same pronunciation and same meaning.

It's really interesting how much lore we've created in our forums that doesn't actually exist in the country of origin.

Re: Anime.js – A lightweight JavaScript animation library

#25
post #22
post #21

Mostly obsolete with CSS tweening. You can do non-blocking animation timelines without any library if you use async javascript. Click me to change color every second, then remove. // Locality of Behavior me = document.currentScript.parentElement; me.addEventListener("click", async event => { me = event.target me.style.transition = "background 1s" await sleep(1000) me.style.background = "red" await sleep(1000) me.styl…

Isn't the WebAnimations API available in modern browsers?

Sure but in many situations a vanilla async function gives you the same result without the extra layer.

Re: Anime.js – A lightweight JavaScript animation library

#27
post #21

Mostly obsolete with CSS tweening. You can do non-blocking animation timelines without any library if you use async javascript. Click me to change color every second, then remove. // Locality of Behavior me = document.currentScript.parentElement; me.addEventListener("click", async event => { me = event.target me.style.transition = "background 1s" await sleep(1000) me.style.background = "red" await sleep(1000) me.styl…

Wanted to note, htmx's companion project at https://hyperscript.org/ does this naturally out of the box as well due to its async transparency.

Re: Anime.js – A lightweight JavaScript animation library

#28

Earlier quoted context omitted.

Framer Motion is a good modern alternative https://github.com/framer/motion

Im not really interested in react only solutions

Motion One is the non-react version of Framer Motion.

https://motion.dev/

Re: Anime.js – A lightweight JavaScript animation library

#29
post #18

Earlier quoted context omitted.

To be fair the library name may be based on Japanese usage, where the term just means anything animated (including all the works you mentioned).

It's like the discussions about manga/manhua/manwha we keep return to, when they're all literally the same word with the same pronunciation and same meaning. It's really interesting how much lore we've created in our forums that doesn't actually exist in the country of origin.

Loanwords from all languages experience semantic shift very often.
Post reply on HN