How I Made My Portfolio Load Faster Than My Attention Span 🏃♂️💨
April 24, 2025
•5 minutes read
If you’ve ever built a portfolio as a developer, you probably know the cycle: you want it to look cool, show off your skills, and maybe sneak in some fancy animations ✨. For the past couple of years, I’ve always reached for Next.js whenever I needed to build something—portfolio, dashboard, app, you name it.
But here’s the thing… Next.js is amazing for building web applications (think dashboards, SaaS products, etc.), but my portfolio? It’s basically a bunch of static pages that almost never change. Using a full-blown web app framework for a mostly-static site was kinda like bringing a rocket launcher to a pillow fight. 🚀🪶
So I decided to rebuild my portfolio using Astro.js—and wow. The performance boost was massive. Pages are now blazing fast, my Lighthouse scores are glowing green, and SEO finally stopped yelling at me.
Why Astro.js?
Astro has this cool idea called “Islands Architecture”. Basically, it ships almost no JavaScript by default. Everything is static HTML until you explicitly tell Astro, “Hey, this part should be interactive.”
That means:
- Super lightweight pages 🪶
- Better SEO because Google crawlers love static HTML 🕷️
- Faster loads because your browser isn’t choking on unnecessary JavaScript
For a portfolio site (which is 95% static content), this is perfect.
But I Still Love Next.js ❤️
Don’t get me wrong—Next.js is still one of my favorite tools. I use it for actual apps where I need routing, server-side rendering, API routes, etc. In fact, even on my new Astro portfolio, I’m still using React components for client-side interactivity. Astro makes it super easy to sprinkle React (or even Vue/Svelte/Solid) wherever you need it.
So it’s not about “Astro vs Next.js” — it’s more about picking the right tool for the job. My portfolio just didn’t need all the heavyweight app features that Next.js brings.
The Results 🚀
- Page load is almost instant (seriously, blink and you’ll miss it).
- My SEO score went way up (Google finally likes me 👀).
- My Lighthouse performance score hit 💯 (chef’s kiss 👨🍳💋).
- I feel better knowing my site isn’t over-engineered for what it needs to do.
Final Thoughts
As devs, it’s easy to default to the frameworks we’re most comfortable with. For me, that was always Next.js. But sometimes, stepping back and asking “What does this project really need?” can give you better results—and teach you something new along the way.
👉 So if you’re building something mostly static, give Astro.js a try. Your users (and your Lighthouse scores) will thank you.