AnimeJs v4 Is Here • Hacker News Board

Re: AnimeJs v4 Is Here

#71

Post by dkersten » Thu, Apr 03, 2025, 10:28 PM UTC

xico wrote: post #48

dkersten wrote: post #45

Earlier quoted context omitted.

That's what I came here to ask too. This looks wonderful, but I'm already using Motion quite a bit. I'm also using React and am unsure how well Anime.js pairs with that while Motion has a first party react library. In any case, like everyone else here, I'm very impressed with OP's site and documentation. Very slick!

The first page in the documentation, Getting Started, gives a React sample: https://animejs.com/documentation/getting-started/using-with...

Ah, I looked at the examples but I guess I missed this. Thanks!

So it basically works outside of react land — you can animate your component but it’s applied after react renders it. It’s nice to see an example and that it works, but I suppose it does mean there are certain things it’s unable to do, such as animating on component removal (Motion does this by adding a wrapper component that detects when its children are removed, I suppose it’s not something you can achieve without special react specific support)

Re: AnimeJs v4 Is Here

#72

Post by chilmers » Thu, Apr 03, 2025, 11:05 PM UTC

azemetre wrote: post #51

jacobgkau wrote: post #13

Scrolling through that landing page felt a lot smoother & snappier than I would've expected for a page looking like that.

Do they explain how they made the landing page or share the code somewhere? I agree, it's stunning.

There is a gh-pages branch, but it is generated from a private repo: https://github.com/juliangarnier/anime/tree/gh-pages

Re: AnimeJs v4 Is Here

#73

Post by hoc » Thu, Apr 03, 2025, 11:28 PM UTC

jonwinstanley wrote: post #62

ryandrake wrote: post #49

Earlier quoted context omitted.

It's clever, but honestly I don't care how smooth it is. Scrolling should simply scroll a view up or down a page. Not invoke animation. We already have established UX patterns for playing media, slowing it down, speeding it up, randomly seeking through it.

So what would you suggest to use to move the animation forward?

That missing Playdate phone accessory.

Re: AnimeJs v4 Is Here

#74

Post by spartanatreyu » Thu, Apr 03, 2025, 11:49 PM UTC

kilolympus wrote: post #66

It could just be me running a CPU that's too old or an unconventional browser (Microsoft Edge), but the website is extremely laggy (less than 1 update per second) and the tab immediately starts using 80% of my CPU with fans blaring. Got an 8th gen Intel i7 if it matters.

What GPU do you have?

Re: AnimeJs v4 Is Here

#75

Post by spartanatreyu » Thu, Apr 03, 2025, 11:50 PM UTC

true_blue wrote: post #67

the website is just a blank black page for me no matter how long I wait. clearly that's not what it's supposed to be going by the other comments, so that's a bit disappointing.

What does your network tab in the browser's dev tools show?

Re: AnimeJs v4 Is Here

#76

Post by bbx » Thu, Apr 03, 2025, 11:51 PM UTC

thih9 wrote: post #9

I like that I can grab and drag the browser’s scroll indicator and the animation updates seamlessly (safari mobile).

TIL you can grab the scroll bar on iOS!!

Thanks for this. Jumping to the bottom of a page was such a chore for me.

Re: AnimeJs v4 Is Here

#77

Post by true_blue » Thu, Apr 03, 2025, 11:58 PM UTC

spartanatreyu wrote: post #75

true_blue wrote: post #67

the website is just a blank black page for me no matter how long I wait. clearly that's not what it's supposed to be going by the other comments, so that's a bit disappointing.

What does your network tab in the browser's dev tools show?

just a bunch of status 200 GET requests. a few are scripts, but mostly just images

Re: AnimeJs v4 Is Here

#78

Post by yamihere » Fri, Apr 04, 2025, 12:43 AM UTC

Just joining in with the “Wow, this is amazing” crowd. I usually detest websites that dink with scrolling to animate content in and out of view, except for well designed long form narrative content; but this is slick.

A challenge to all the “10x-ed my productivity” LLManiacs: how long to recreate this landing page using nothing but prompts (and how much $$ for a how-to course :)

A challenge to the “the’re gonna take our jobs” LLMongers: git gud, its possible. this is living proof.

(yes, i did just want to post those portmanteaus, even though it was all ChatGPT: https://pastebin.com/zrsj6DcB )

Re: AnimeJs v4 Is Here

#79

Post by evilduck » Fri, Apr 04, 2025, 12:55 AM UTC

jonwinstanley wrote: post #62

ryandrake wrote: post #49

Earlier quoted context omitted.

It's clever, but honestly I don't care how smooth it is. Scrolling should simply scroll a view up or down a page. Not invoke animation. We already have established UX patterns for playing media, slowing it down, speeding it up, randomly seeking through it.

So what would you suggest to use to move the animation forward?

Submitting a form repeatedly by hammering enter and having a new HTML fragment rendered on the server deliver the next frame, obviously.

Re: AnimeJs v4 Is Here

#80

Post by skeptrune » Fri, Apr 04, 2025, 2:18 AM UTC

I feel like web tech is getting a lot more mature and reliable. Just my personal vibe-read, but JS libs on the whole seem to be getting to be consistently hitting higher quality bars.