Saltar al contenido

Shopify estándar vs Shopify Headless con Astro: cuándo cada uno

Decisión clave para e-commerce: theme oficial vs frontend Astro headless. Coste, velocidad, mantenimiento y casos donde cada opción gana.

IM
IMPERO Equipo IMPERO
·
11 min de lectura
#shopify #headless #astro #storefront api #comparativa

Quien ya vende con Shopify y empieza a sentir el techo del theme oficial llega tarde o temprano a la misma pregunta: ¿merece la pena saltar a un frontend headless con Astro o React? Y al revés, quien arranca tienda nueva con presupuesto serio se plantea si saltar directamente a headless evita problemas futuros.

Esta guía compara las dos arquitecturas sin defender ninguna por defecto. Shopify estándar (theme Liquid + Online Store 2.0) es la opción correcta para la mayoría de las pymes. Shopify Headless con Astro es la opción correcta para un perfil concreto que vale la pena identificar antes de gastar dinero.

La pregunta que se hace toda tienda que ya rinde

Shopify estándar funciona bien para la inmensa mayoría de las tiendas españolas. Tema oficial, app store, equipo no técnico que gestiona producto y campañas, conversión razonable. Es el camino más corto al éxito.

Pero hay un perfil de tienda donde el theme estándar se queda corto: la que ya factura serio (medio millón al año o más), invierte fuerte en Meta Ads o Google Ads, mide cada décima de LCP en conversión, quiere un branding que ningún theme del marketplace ofrece y tiene equipo (o agencia) técnico para gestionar una pila más compleja.

Para ese perfil, Shopify Headless con Astro abre una palanca real: tienda 2-4 veces más rápida, diseño totalmente a medida, libertad para integrar contenido editorial, multi-marca o multi-país sin las limitaciones del theme oficial.

Qué es cada arquitectura

Shopify estándar (theme Liquid + Online Store 2.0)

La forma “clásica” de tener Shopify. Tu tienda usa un theme oficial (Dawn, Sense, Refresh) o premium (Out of the Sandbox, Pixel Union) escrito en Liquid, el lenguaje de plantillas propio de Shopify. El frontend lo sirve Shopify directamente desde su infraestructura (AWS + Cloudflare) en tutienda.com o el subdominio que toque.

Por dentro: theme Liquid + ediciones visuales con Online Store 2.0 + apps del App Store que inyectan código en el theme + tus pasarelas de pago + checkout propiedad de Shopify. Todo vive dentro de Shopify, sin servidores adicionales.

Shopify Headless (Storefront API + frontend Astro)

Shopify se queda como backend de e-commerce (productos, inventario, checkout, pedidos, clientes, apps que escriben en la base) y el frontend se construye en otra parte usando la Storefront API de Shopify (GraphQL). El frontend lo desarrollas en Astro, React, Next.js o el framework que elijas y lo despliegas en Cloudflare Pages, Vercel o Netlify.

Por dentro: Astro + componentes React donde haga falta interactividad + llamadas GraphQL a Storefront API para productos, colecciones, carrito + checkout redirigido a Shopify oficial (PCI-DSS sigue siendo responsabilidad de Shopify) + apps Shopify que sigan funcionando en backend (analytics, email marketing, inventario). Más sobre Astro en el glosario y sobre edge computing que es donde se sirve.

Resumen ejecutivo

CriterioShopify estándarShopify Headless con Astro
Tiempo de desarrollo2-5 semanas6-12 semanas
Coste inicial1.500-6.000 €8.000-25.000 €
Coste mensual añadidoApps + suscripciónApps + suscripción + hosting CDN (0-50 €)
Velocidad típica LCP móvil1,5-3 s0,3-1,2 s
Score Lighthouse móvil50-8095-100
Libertad de diseñoLimitada al themeTotal
Dependencia técnicaBajaMedia-alta
Compatibilidad con apps Shopify100 %Parcial (algunas no funcionan en headless)
EscalabilidadExcelenteExcelente
Propiedad del frontendTheme atado a ShopifyCódigo en Git, portable

A grandes rasgos: Shopify estándar es rápido de montar y barato, Headless es lento de montar y caro al inicio pero técnicamente superior en todo lo que importa para una tienda exigente.

Velocidad: la diferencia más visible

El theme estándar de Shopify carga el frontend desde la infraestructura Shopify. Es rápido en términos absolutos pero carga JavaScript del theme, apps inyectadas, scripts de tracking, fuentes web y CSS que el theme arrastra. Con un theme bien optimizado y pocas apps, una tienda Shopify estándar puede sacar:

  • LCP móvil: 1,5-3 segundos
  • CLS (estabilidad visual): 0,05-0,15
  • INP (interactividad): 100-250 ms
  • Lighthouse móvil: 50-80

Con un theme pesado o muchas apps inyectadas, la velocidad puede caer a LCP 3-5 segundos y Lighthouse 30-50. Esto pasa con frecuencia en tiendas con 10+ apps activas que cargan scripts en cada página.

Shopify Headless con Astro sirve HTML estático generado en build (o renderizado en edge con SSR) desde CDN edge global. El visitante recibe HTML pre-cocinado sin esperar al backend Shopify. Solo se cargan las llamadas dinámicas que necesite (precio en stock, variantes, carrito). Resultado típico:

  • LCP móvil: 0,3-1,2 segundos
  • CLS: menor de 0,05
  • INP: menor de 100 ms
  • Lighthouse móvil: 95-100

La diferencia es de un orden de magnitud. Para una tienda que dependa del SEO orgánico o que invierta fuerte en Ads, esa diferencia se traduce directamente en conversión y en Quality Score.

Coste real a tres años

Para una tienda pequeña, el coste extra de headless no se amortiza fácilmente. La inversión solo tiene sentido si el branding único y la velocidad son ventaja competitiva real.

Para tienda mediana, headless cuesta el doble pero suele justificarse si: la tienda invierte más de 3.000 €/mes en Ads (la mejora de Quality Score y de conversión paga la diferencia en 12-18 meses), si la marca quiere experiencia visual única, o si está creciendo rápido.

En tienda de tráfico alto, la diferencia relativa baja al 10-30 % porque el coste fijo de Shopify Plus es enorme. Aquí headless se justifica casi siempre por motivos de branding, conversión y diferenciación competitiva.

Libertad de diseño

Shopify estándar permite personalización mediante el editor visual de Online Store 2.0, secciones reutilizables y bloques. Para llegar a un diseño verdaderamente único hay que editar Liquid, que tiene límites de lo que se puede hacer (especialmente en interacciones complejas, animaciones avanzadas o composiciones que no encajan en el modelo de secciones).

Shopify Headless te da libertad absoluta: cualquier diseño que sepa hacer un diseñador y programar un developer se puede ejecutar. Animaciones GSAP, layouts editorial-style, componentes interactivos complejos, gamificación, integración de contenido editorial profundo. La única limitación es el presupuesto.

Para una marca con identidad muy fuerte y diferenciación visual como activo, headless es la única ruta. Para una tienda donde el producto manda y el diseño es estándar, Shopify estándar basta.

Compatibilidad con apps Shopify

Este es el punto donde headless tiene una pega real que no se discute lo suficiente.

Shopify estándar: todas las apps del App Store funcionan al 100 %. Las apps inyectan su código en el theme Liquid y operan tanto en backend como en frontend.

Shopify Headless: las apps que viven solo en backend (Klaviyo, ShipStation, ERP integrations, analytics, reviews que sincronizan al backend) funcionan sin problema. Las apps que inyectan scripts en el frontend (popups, exit-intent, upsells en producto, chat, gamificación visual) requieren reimplementación en el frontend custom o sustitución por equivalentes que tengan SDK.

Esto significa que cada app de frontend que uses tiene que evaluarse antes de saltar a headless. Algunas tienen SDK headless (Klaviyo Forms tiene API, Yotpo y Loox tienen SDK), otras hay que reimplementar a mano.

SEO técnico

Las dos arquitecturas pueden hacer buen SEO, pero parten de puntos distintos.

Shopify estándar: SEO sólido con limitaciones estructurales. URL forzadas en /collections/, /products/, /pages/. Schema básico de Product incluido. Velocidad media buena pero no excelente. Lo cubrimos en detalle en WooCommerce vs Shopify para PYMES.

Shopify Headless con Astro: SEO técnico sin restricciones. URL totalmente personalizables, schema completo (Product, BreadcrumbList, Organization, FAQ, Review, HowTo), Core Web Vitals en verde por defecto, sitemap personalizado, control total del head, schema JSON-LD trivial. Es el techo del SEO técnico en e-commerce.

Para una tienda que vive del SEO orgánico (búsquedas de producto, contenido editorial que captura long tail, blog activo), headless da más palanca. Para una tienda que vive principalmente de Ads, la diferencia es menos crítica pero sigue impactando en Quality Score.

Cuándo Shopify estándar gana

Shopify estándar es la opción correcta si:

  • Acabas de empezar o estás en los primeros 2-3 años de tienda.
  • Facturas menos de 300.000 € al año y aún optimizas más cosas básicas que arquitectura.
  • Tu equipo no es técnico y la tienda la gestiona alguien de marketing o el propio dueño.
  • Dependes de muchas apps Shopify que no quieres reemplazar.
  • Tu prioridad es time to market: lanzar pronto, iterar, validar producto.
  • Tu diferenciación es producto y precio, no experiencia visual única.
  • Tu sector tiene plantillas Shopify ya muy buenas (moda, deco, suplementación, accesorios).

Cuándo Headless gana

Shopify Headless con Astro es la opción correcta si:

  • Facturas más de 500.000 € al año y cada décima de velocidad o conversión cuenta.
  • Inviertes serio en Ads (más de 3.000 €/mes en Meta o Google) y la velocidad de landing afecta a CPC y a conversión post-clic.
  • Tu marca tiene identidad muy fuerte y necesitas diseño que ningún theme oficial ofrece.
  • Vendes en varios países con experiencias y contenido distinto por mercado.
  • Tu tienda compite por SEO orgánico en categorías muy disputadas y necesitas el máximo en Core Web Vitals.
  • Tienes equipo técnico interno o agencia de confianza capaz de mantener la pila.
  • Quieres preparar la tienda para 3-5 años sin tener que rediseñar cada 18 meses.

Cuándo Headless NO es la mejor opción

Por honestidad, hay casos donde headless es sobreingeniería:

  • Tienda con tracción no comprobada. Si no sabes si el producto vende, gastar 15.000 € en headless en lugar de 3.000 € en theme estándar es atar capital que necesitas para Ads y validación.
  • Equipo sin recursos técnicos. Una tienda headless sin alguien que mantenga el frontend acaba degradándose o requiere agencia mensual.
  • Dependencia de apps Shopify frontend no migrables. Si tu marketing depende de 5 apps con scripts en el theme, reimplementarlas todas es proyecto en sí mismo.
  • Catálogo muy cambiante sin equipo dev que ajuste plantillas a nuevas categorías. El theme estándar con Online Store 2.0 es más amable para crear secciones nuevas sobre la marcha.
  • Operativa Shopify Plus muy específica (Shopify Flow complejos, Functions personalizadas que interactúan con el theme). Algunas funciones Plus están pensadas para theme estándar.

Matriz de decisión por perfil

PerfilRecomendación
Tienda nueva 0-200.000 € facturaciónShopify estándar con theme decente
Tienda 200.000-500.000 €, equipo no técnicoShopify estándar con theme premium
Tienda 500.000-1M €, foco en SEO orgánicoEvaluar Headless seriamente
Tienda 500.000-1M €, foco solo en Ads socialesShopify estándar bien optimizado
Tienda 1M+ € con marca premiumHeadless casi siempre
Tienda multimarca o multidominioHeadless con frontend unificado
Tienda multipaís con experiencia muy distinta por mercadoHeadless
D2C con identidad visual muy fuerteHeadless
Tienda B2B con catálogo complejo y precios por clienteShopify B2B estándar o evaluar otras pilas

Cuándo migrar de estándar a headless

Señales reales de que tu tienda Shopify estándar ha llegado al techo y headless es el siguiente paso:

  1. Tu LCP móvil supera los 2,5 segundos y has agotado las optimizaciones del theme.
  2. Tu Lighthouse móvil no pasa de 70 con un theme razonable.
  3. El theme te limita visualmente y los desarrollos custom dentro del theme son caros e inestables.
  4. Inviertes más de 5.000 €/mes en Ads y cada décima de Quality Score importa.
  5. Tu tienda compite por SEO en categorías muy disputadas y necesitas el máximo en Core Web Vitals.
  6. Quieres unificar varias tiendas bajo un mismo paraguas con frontend único.
  7. Tu marca necesita branding diferenciado que ningún theme oficial puede ofrecer.

Si tres o más son ciertas, el caso de negocio para headless suele cerrarse positivo. La migración bien hecha mantiene 100 % la operativa Shopify (productos, pedidos, clientes, apps backend) y solo reemplaza la capa frontend.

Migrar bien: las claves no negociables

Una migración estándar → headless preserva tres cosas: datos, SEO y operativa. Para eso hace falta:

  • Inventario completo de URLs antiguas del theme.
  • Mapa 1:1 de URLs antiguas → URLs nuevas con redirects 301.
  • Plan de despliegue gradual: tienda nueva en subdominio o staging antes del corte.
  • Validación de apps backend (analytics, email, reviews) que sigan sincronizando bien.
  • Reimplementación o sustitución de apps frontend no compatibles.
  • Plan de monitorización del SEO durante los 90 días posteriores al corte.
  • Formación al equipo no técnico sobre cómo editar contenido (CMS headless si aplica, o flujo Git-based).

Sin esos pasos, una migración mal hecha destruye tráfico orgánico o rompe operativas críticas. Por eso tenemos un servicio dedicado de Shopify Headless con Astro que cubre análisis previo, arquitectura, desarrollo y migración con preservación de SEO.

Si lo que necesitas es montar Shopify desde cero o migrar a Shopify desde otra plataforma (WooCommerce, PrestaShop), la entrada estándar es migración a Shopify, que cubre el escenario de theme oficial.

Veredicto honesto

Para la mayoría de las tiendas Shopify (digamos el 80 % del mercado), Shopify estándar bien hecho es la respuesta correcta. Theme decente o custom, apps cuidadas, mantenimiento operativo razonable. Time to market rápido, equipo no técnico autosuficiente, escalabilidad cubierta.

Para el 20 % de tiendas exigentes (facturación media-alta, foco en velocidad, branding premium, Ads serios, SEO competitivo, equipo técnico disponible), Shopify Headless con Astro abre una palanca real: velocidad de orden de magnitud superior, libertad total de diseño, ventaja en SEO técnico y diferenciación visual.

El error caro es elegir headless por moda técnica sin tener los números o el perfil que lo justifique. La inversión inicial extra solo se amortiza si la tienda tiene volumen, presupuesto Ads y marca que aprovechen la palanca técnica.

Shopify estándar lleva el 80 % de las tiendas hasta donde necesitan ir. Headless lleva al 20 % restante más allá de donde el theme oficial las dejaría. El error es elegir mal el porcentaje en el que estás.

La conclusión sin rodeos

Siguientes pasos

Servicio relacionado

¿Te interesa nuestro servicio de Captación de Clientes?

Campañas de Google Ads y Meta Ads gestionadas con optimización diaria. Tus cuentas, tu dominio, tu control. Desde 300 € al mes por canal.

Ver Captación de Clientes

¿QUIERES QUE
ANALICEMOS TU CASO?

Solicita una auditoría técnica gratuita y descubre oportunidades reales de mejora para tu negocio.

Solicitar Auditoría Gratuita
Da el primer paso

AUDITORÍA GRATUITA
SIN COMPROMISO.

Reserva una llamada de 15 minutos. Analizamos tu web, tu publicidad y tu posicionamiento digital. Te decimos exactamente qué mejorar y cuánto puedes ahorrar. Sin coste, sin compromiso.