SPA
Single Page Application
ELI5 — The Vibe Check
A SPA is a website that loads ONE HTML page and then never does a full page reload again. Navigation happens entirely in JavaScript — it swaps out content on the fly. Think Gmail or Notion. Super smooth but harder for SEO if you're not careful.
Real Talk
An SPA loads a single HTML document and dynamically updates content via JavaScript as the user navigates. A client-side router intercepts navigation events and renders the correct component without full page reloads. SPAs provide app-like UX but require client-side rendering considerations for SEO.
Show Me The Code
// Vue Router turns your app into a SPA
import { createRouter, createWebHistory } from 'vue-router';
const router = createRouter({
history: createWebHistory(),
routes: [
{ path: '/', component: Home },
{ path: '/about', component: About },
]
});
When You'll Hear This
"Our dashboard is a SPA — it never does full reloads." / "SPAs have poor SEO without SSR unless you add prerendering."
Related Terms
CSR (Client-Side Rendering)
CSR means the browser downloads a mostly-empty HTML page plus a big JavaScript bundle, then builds the full page in the browser.
MPA (Multi-Page Application)
An MPA is the old-school way — every link click loads a completely new HTML page from the server. Think Wikipedia. Each page is its own thing.
React
React is a JavaScript library from Meta for building UIs out of components.
SSG (Static Site Generation)
SSG builds all your pages ahead of time — before anyone visits. You get a folder of plain HTML files that are blazing fast to serve from a CDN.
SSR (Server-Side Rendering)
SSR means the server builds your HTML before sending it to the user's browser.
Vue
Vue is a JavaScript framework for building interactive UIs. It's famous for being easy to pick up — HTML developers feel right at home.