Blender Animations and THREE.js - MEOW!

#blender #animation #javascript #threejs

First experience with Blender! (and 3-D modeling, really) Took a fun dive into blender today and made a cat of sorts. I successfully created a brief animation. Not to difficult.

In fact, it was an awesome experience. Should have tried this before. Now, of course, I want to put my already-animated cat on the web using Three.js. Its turning out to be more complicated than expected.

I did, however manage to get the cat loaded using the GLTFLoader. Nice and easy. But, I am stuck trying to figure out how to make the animations appear. I tried a few things, including:

making separate keyframe png files
adding a clock
calling mixer

I've been digging for answers for a few hours and would love feedback on this matter. I did find some fun moving grass which I successfully added to the file.

We've really gotta figure our this animation business. I have like half an idea what's going on. What's your finest input on the matter?

Identify what makes your TTFB high so you can fix it

In the past few years in the web dev world, we’ve seen a significant push towards rendering our websites on the server. Doing so is better for SEO and performs better on low-powered devices, but one thing we had to sacrifice is TTFB.