Contents

You finished the article!
BACK TO WRITINGS
ENGINEERING20 May 20265 MIN READ

ThePowerofZero-JSbyDefault

Why I decided to bin Next.js for my personal site and move over to Astro. It's all about that sweet, sweet performance and a 100 Lighthouse score.

For a long time, Next.js was my primary choice for web projects. It is a brilliant framework for complex applications, and I still use it for many of my larger builds. However, for a personal portfolio, it started to feel like I was using a sledgehammer to crack a nut.

Whenever I ran a Lighthouse audit on a simple Next.js site, I noticed a massive chunk of JavaScript being shipped to the browser. This happened even when the site was mostly composed of static text and images. Because of this, I decided to take the plunge and migrate this entire site to Astro.

Zero-JS: Not Just a Buzzword

The core philosophy of Astro is to be zero-JS by default. It renders your entire site to static HTML at build time. If a specific component does not require interactivity, the browser never has to download a single line of its JavaScript.

The difference in performance was immediate and obvious. Initial load times plummeted and the site feels incredibly snappy. This is a massive win on mobile devices where bandwidth and CPU power are often limited. Visitors are no longer waiting for a massive bundle to hydrate because the content is ready to view instantly.

The Islands Architecture

There are still parts of the site that require JavaScript, such as the Tic-Tac-Toe captcha or the theme toggle. This is where the Astro Islands architecture really shines. I can build a component in React, drop it into an Astro page, and tell the framework exactly when to load the code.

This approach provides a brilliant middle ground. I can keep using the React tools that I love, but I only use them where they actually add value. The rest of the page remains lean and remarkably easy to maintain.

Was it worth the effort?

A migration always takes a bit of time, especially when you are moving between frameworks with different routing patterns. However, seeing a perfect 100 score on Lighthouse made it completely worth the faff. I also like knowing that I am not wasting my visitors' mobile data plans.

If you are currently building a content-heavy site or a portfolio, I highly recommend giving Astro a look. It has simplified my development workflow and helped make the web just a little bit faster. Cheers to that.

TAGS

#astro#performance#webperf