Single Page Application (SPA)

A Single Page Application (SPA) is a web architecture where the browser loads one HTML page upfront, then uses JavaScript to swap content in and out as you navigate, instead of requesting a new page from the server each time. This makes transitions feel instant and app-like, but it comes with tradeoffs: the initial download is heavier, and search engines can struggle to index content that’s generated entirely by JavaScript. Many modern frameworks now offer hybrid approaches that combine SPA-like speed with traditional page-based SEO.

The Simple Version

On a traditional website, every time you click a link, the browser loads an entirely new page from the server. In a Single Page Application, the entire site loads once, and then clicking around just swaps out the content on screen without a full page reload. It feels more like using an app on your phone than browsing a website.

Gmail, Google Maps, and Spotify’s web player are all SPAs.

Why It Matters

SPAs feel fast and fluid because there’s no visible page reload. But they come with tradeoffs. The initial load can be heavy because the browser has to download all the JavaScript upfront. And search engines can have a harder time indexing SPA content because the HTML is generated by JavaScript rather than served directly.

For content-heavy sites that need strong SEO (like a portfolio or blog), a static site is usually a better choice. SPAs shine for complex interactive applications.

How It’s Used on This Site

The original version of this site was an SPA built with React via Lovable. It was later migrated to Astro, which generates static HTML pages. The old SPA code is preserved on a legacy branch in Git for reference.