Qué es SPA
SPA (Single Page Application) es una arquitectura web donde toda la “app” es una única página HTML que carga JavaScript y luego cambia el contenido dinámicamente sin recargar la página.
Ejemplos: Gmail, Twitter, Trello, la mayoría de SaaS modernos.
Qué es MPA
MPA (Multi Page Application) es la arquitectura web clásica: cada URL es una página HTML separada que el servidor sirve. Al navegar, el navegador recarga completamente.
Ejemplos: Wikipedia, Amazon (mayormente), webs corporativas, blogs.
Diferencias técnicas
| Aspecto | SPA | MPA |
|---|---|---|
| Páginas | 1 HTML, cambia contenido vía JS | N páginas HTML separadas |
| Carga inicial | Lenta (bundle JS grande) | Rápida (solo la página actual) |
| Navegación posterior | Instantánea (sin recarga) | Recarga completa |
| SEO | Difícil sin SSR | Excelente por defecto |
| Compartir URL | Requiere routing client-side | Natural |
| Estado | Persiste entre vistas | Se pierde al navegar |
| Stack típico | React, Vue, Angular | HTML, PHP, Astro, WordPress |
Cuándo usar SPA
✓ Buenos casos
- Aplicaciones tipo dashboard: SaaS, panel admin
- Apps con estado complejo: editores online, juegos, herramientas
- Login + usuarios + interactividad densa
- Datos en tiempo real: chats, feeds
- Mobile-first apps: la sensación “app” importa
✗ Casos donde NO es ideal
- Webs corporativas estáticas
- Blogs y content sites
- Ecommerce con SEO crítico
- Landing pages
- Documentación
Cuándo usar MPA
✓ Buenos casos
- Webs corporativas (información estática)
- Blogs y magazines
- Ecommerce con catálogo grande
- Documentación de producto
- Landing pages comerciales
- Cualquier sitio donde SEO sea importante
✗ Casos donde NO es ideal
- SaaS con login y datos personalizados
- Apps con UI muy interactiva
- Cuando quieres “feeling app móvil”
Hybrid (lo mejor de ambos)
Frameworks modernos permiten híbridos:
MPA con interactividad puntual (Astro)
- HTML estático por defecto (excelente SEO + carga rápida)
- “Islands” de interactividad donde se necesite
- Resultado: SEO perfecto + experiencia rica donde toca
SPA con SSR (Next.js)
- Server-rendering para SEO en primera carga
- Hidratación a SPA para navegación posterior fluida
- Resultado: SEO razonable + sensación SPA
SEO en SPAs
Históricamente, las SPAs eran terribles en SEO porque Google veía HTML vacío y JavaScript pesado.
Hoy mejor pero aún con problemas:
- Google PUEDE rastrear JS pero no es perfecto
- Otros buscadores (Bing, DuckDuckGo) son peores
- Crawl budget se desperdicia
- Carga inicial lenta penaliza Core Web Vitals
Solución: SSR (Server-Side Rendering) o SSG (Static Site Generation) para que el HTML inicial tenga contenido.
Mi opinión técnica
Para una pyme con web corporativa o blog: MPA con stack moderno (Astro recomendado). Mejor SEO, más rápido, más simple.
Para SaaS con dashboards o apps interactivas: SPA con SSR (Next.js, Nuxt, SvelteKit).
Nunca SPA puro sin SSR en 2026 si te importa SEO.