Real World Example

Real World: Gmail (SPA) vs a news website (MPA)

Gmail loads once; opening a mail only fetches JSON and swaps the view, so it feels instant. A news site loads a new HTML page per article, which is good for SEO. Spotify web is an SPA so music keeps playing while you browse; Next.js sites mix both (server-rendered first page, SPA after).

// Gmail-like SPA: only data is fetched, the page is never reloaded
async function openMail(id) {
  const mail = await fetch('/api/mails/' + id).then((r) => r.json());
  setOpenMail(mail);                       // React swaps the view
  history.pushState({}, '', '/inbox/' + id); // URL changes, no reload
}