Help needed: Switched from game dev to web dev, now stuck with slow-loading SPA. What's my next move?

Hey folks, I’m a newbie web developer who started off using Vite for my personal project showcase site. I’ve got a ton of pages and mini-projects on there now, but I’m hitting a snag with slow load times.

I recently learned about the differences between SPAs, SSR, and SSG. Now I’m realizing my Vite-created React app might not be the best fit for what I need.

I’ve looked into Next.js and Astro, but I’m not sure if I should:

  1. Stick with my current setup and deal with the slow loading
  2. Try porting everything to Astro
  3. Bite the bullet and rebuild in Next.js
  4. Or maybe something else entirely?

What would you recommend for a long-term solution? I’m worried about making the wrong choice and having to redo everything again. Any advice would be super helpful!

// Current setup (simplified)
import React from 'react'
import ReactDOM from 'react-dom/client'
import App from './App'

ReactDOM.createRoot(document.getElementById('root')).render(
  <React.StrictMode>
    <App />
  </React.StrictMode>,
)

Thanks in advance for any guidance!

As someone who’s made the leap from game dev to web dev, I totally get your struggle with performance issues. I’ve been there, and it’s a headache!

From my experience, I’d suggest giving Next.js a shot. It’s not as daunting as it might seem, especially if you’re already comfortable with React. The performance gains are seriously worth it.

What worked for me was gradually moving my React components over to Next.js. This way, you’re not rebuilding everything from scratch, which can be overwhelming. Plus, Next.js has some killer features like automatic code splitting and image optimization that’ll make your showcase site shine.

Don’t sweat about making the ‘wrong’ choice. Web dev is all about adapting and learning. Whatever you pick, you’ll gain valuable skills. And remember, you can always pivot later if needed.

Good luck with your project! The fact that you’re thinking about performance already puts you ahead of the game.

As someone who’s been through a similar transition, I’d recommend giving Next.js a shot. It’s got a gentler learning curve than you might expect, especially coming from React.

The performance gains from server-side rendering and automatic code splitting are significant. Plus, the built-in image optimization is a game-changer for sites with lots of visual content.

One approach that worked well for me was gradually migrating my existing React components into a Next.js project. This way, you can tackle the transition in manageable chunks rather than rebuilding everything from scratch.

Remember, there’s no perfect solution - but Next.js offers a solid foundation that can grow with your skills and project needs. Good luck with your decision!

hey there! i’ve been in ur shoes before. my advice? give next.js a try. it’s not as scary as it looks and the performance boost is worth it.

i started by moving my react components over bit by bit. that way, u don’t have to rebuild everything at once. plus, the image optimization in next.js is awesome for showcases.

good luck with ur decision!