← back

The Power of Web Development with Next.JS

Notes on moving from Nuxt to Next: performance, libraries and animation.

After a couple of years leaning heavily on Nuxt, I spent the last few months rebuilding my personal projects with Next.js. I’ve been impressed by how much its ecosystem has grown up.

Why the switch

I wasn’t unhappy with Nuxt. It’s still a lovely framework. I switched for three reasons:

  1. The sheer number of UI libraries in the React ecosystem
  2. Server Components, which open up different ways to load data
  3. First-class TypeScript support across the whole toolchain

The animation side

Motion is the part I care about most. With Framer Motion, GSAP and newer kits like motion-primitives, small animations that used to take real effort are now easy to add.

import { motion } from "motion/react";

export function Hero() {
  return (
    <motion.h1
      initial={{ opacity: 0, y: 20 }}
      animate={{ opacity: 1, y: 0 }}
      transition={{ duration: 0.6, ease: [0.22, 1, 0.36, 1] }}
    >
      tuna
    </motion.h1>
  );
}

Performance

With the App Router and React Server Components, Next ships less JavaScript by default. That’s a bigger win than shaving a few milliseconds off render times, because less code reaches the browser in the first place.


More coming soon.