Next.js nope - Remix and Astro.js yes!

var nextJs = new Error('Next.js is not for everything')
const astro = "Astro.js is just amazing period"
let remix = "I like Remix, lets keep improving it!"

for (let i = 0; i < 100; i++) {
  console.log("let's use Astro and improve Remix for SPAs")
}
throw nextJs // Uncaught Error: Next.js is not for everything at <anonymous>:1:7

I am a big Next.js fan you must know. I really love a lot of aspects of Vercel and Next.js. Beginning with how high tech they are and how good they did their branding and marketing. Not to forget how much they innovated in the Javascript Ecosystem with their approach on frontend. But I have to say, the more I work with the more I doubt it's a one fits all solution. Actually I think Next.js is only for a nieche of projects. But let's start from the beginning.

What makes Next.js so unique?

There are a lot of things but let me point out the most important ones:

  • 💰Money: Nextjs is heavily funded and it has a lot of resources for development
  • ✨Innovation: it's on the bleeding edge of technology and they sometimes try to reinvent the wheel
  • 🖥️ RSC: React Server Components are could be a game changer and Next.js is the first to implement them (but its still buggy tbh)
  • 🚀Hype: Next.js is hyped and you feel cool when you use it
  • 📦Ecosystem: Next.js has a vast ecosystem with a lot of plugins and tools
  • 📈Performance: Next.js is faster than others but not always
  • 📚Documentation: Next.js has a fairly good documentation and tutorials
  • 🧑‍💻Community: Next.js has a big community and you can find a lot of help

What I love most about Next.js

I personally really love working on the bleeding edge with the hope that it turns out to be the new way of doing things. Also experimenting and trying out new paradigms and new tooling is something I enjoy. Also I really like how Next.js solved the file based routing problem - and after seeing thousands of page.tsx and route.tsx I kind of got used to working with it. (You have to CMD+P <route>page.tsx a lot in Next.js)

How Vercel tries to reinvent the wheel and sometimes fails

Bleeding edge is awesome but sometimes it's just too much. Somehow I think Vercel is trying to reinvent the wheel, fails and is then too stubborn to admit that they erred in that regard. I mainly think of Turbopack and ISR. We have vite and we have SWR and I just can't think of a reason why Vercel keeps pushing their own solutions.

What I would use Next.js for

For small to medium sized projects where development does not require a lot of hot module reloading and you can for sure host on Vercel. If you can not host on Vercel or you would like to see every small change you make in the browser, I would not recommend Next.js. Also if you are not a fan of the file based routing with page.tsx and route.tsx everywhere I would not recommend Next.js. Use Astro or Remix instead.

Framework vs Infrastructure

Next.js is more of an infrastructure+framework than a plain framework. Controlling the Framework and the Infrastructure gives Vercel a lot of power to innovate and move fast. They can implement on the infrastructure level and the framework level. But this also means if you can't host on Vercel or you can't afford the 💰💰💰 hosting costs you kind of loose the benefits of Next.js and have to live with all the downsides.

What Remix does better

Remix first of all is the extension of react-router-dom and everyone knows that these guys are the React OGs. But lets focus on the things Remix does better than Next.js:

  • 📺Web Standards: Remix is more focused on web standards and tries to be more compatible with universal web standards. If you used another web framework before you will understand everything in Remix
  • 🚀Hot Module Reloading: Remix embraced Vite and Vite is just plain amazing!
  • 🗺️Ease of use: Remix is just so much easier to use and understand than Next.js
  • 🚑Stability: Remix is rock solid and you can rely on it
  • ⚡️Performance: Remix can be faster than Next.js
  • ✨Without Magic: Remix is just plain React and you can understand everything that is happening
  • 📦Plugins: All React plugins work with Remix

Remix is not so cutting edge unfortunately but it's a lot more stable and reliable than Next.js. I would recommend Remix for medium to large projects where you need a lot of stability and reliability and where a lot of money is at stake.

What makes Astro.js just amazing

If you haven't used Astro.js already please stop reading this article and go to their website and try it out, seriously! Astro.js is just amazing and you know experienced developers made it because you can feel how much thought went into it. Here are the things that make Astro.js so amazing:

  • 🚀Speed: Astro.js is just so fast, it's like a rocket 100 Lighthouse score out of the box basically
  • 📉Low JS: Astro.js helps you reduce this JS madness that is going on in the frontend world and helps you add JS only where you need it
  • 🫴Simplicity: Astro.js is just so simple and easy to use, you can learn it in a day
  • 💬Made for content: Astro.js is made for content heacy websites
  • 🪄No magic: Astro.js is just plain HTML, CSS and JS and everything else is optional
  • 🗝️No lock in: Astro.js lets you decide if you want to use React, Vue, Svelte or whatever you like. You can also use everything together

Please try it out soon.

Conclusion

If you want to experiment with RSC go ahead and use Next.js. But for everything serious and everything with more users please don't reinvent the wheel and use something established and not something too hyped.

I am currently deciding on which one to use for my companies rewrite and although I am not fully settled one any on of them I lean towards Astro first, Remix second, Next.js third. You have to decide whether you want a SPA feeling or a more traditional web feeling. Although Astro can also nest SPA's in it please just use Remix or Plain React for that.

So I hope I could give you some insights on what to use and what not to use. Have a nice one!