Aunque Shopify se encarga del hosting y la infraestructura, esto no garantiza que tu tienda sea rápida. El rendimiento depende principalmente del tema que uses, las apps instaladas, el tamaño de las imágenes y el código personalizado que hayas añadido.
Shopify proporciona un «Speed Score» basado en Lighthouse que puntúa tu tienda del 0 al 100. La mayoría de tiendas Shopify obtienen entre 30 y 50 en móvil, muy por debajo del 70 recomendado. Con las optimizaciones correctas, puedes mejorar significativamente esta puntuación.
Auditar y reducir apps instaladas
Las apps son el principal factor de lentitud en Shopify. Cada app inyecta código JavaScript y CSS en tu tienda, incluso en páginas donde no se utiliza. Una tienda con 15-20 apps puede tener 30+ scripts externos cargando en cada visita.
Desinstala las apps que no uses activamente. Desinstalar no siempre elimina el código residual: muchas apps dejan fragmentos de código en el tema. Revisa el archivo theme.liquid y los snippets del tema para eliminar código de apps desinstaladas.
Para las apps que necesitas mantener, evalúa si hay alternativas más ligeras. Algunas funcionalidades que implementas con apps pueden resolverse con código nativo del tema: temporizadores de urgencia, badges de producto, popups simples o barras de envío gratuito.
- Haz un inventario de todas las apps y su propósito
- Desinstala las que no generan valor directo
- Busca código residual de apps desinstaladas en el tema
- Sustituye apps simples por código nativo cuando sea posible
- Prioriza apps que carguen sus scripts de forma lazy
Optimización de imágenes
Shopify convierte automáticamente las imágenes a WebP y genera versiones en diferentes tamaños. Sin embargo, si subes imágenes de 4000x4000 px y 5 MB, el procesamiento inicial y las versiones generadas seguirán siendo más pesadas de lo necesario.
Sube imágenes con dimensiones máximas de 2048x2048 px para productos y 1920 px de ancho para banners. Comprime las imágenes antes de subirlas con herramientas como TinyPNG o Squoosh. Esto reduce significativamente el peso sin pérdida visual perceptible.
Revisa las secciones del tema que muestran imágenes decorativas, fondos y sliders. Los sliders con imágenes de alta resolución que rotan automáticamente son especialmente problemáticos: cargan todas las imágenes de golpe aunque solo una sea visible.
Elegir y optimizar el tema
El tema es la base del rendimiento de tu tienda. Los temas de la tienda oficial de Shopify (Dawn, Craft, Sense, etc.) están optimizados y cumplen con estándares de rendimiento. Los temas de terceros varían enormemente en calidad de código.
Dawn, el tema gratuito de Shopify, es el más rápido y sirve como referencia. Si tu tema actual puntúa 20-30 puntos por debajo de Dawn con el mismo contenido, el tema es el problema. Considera migrar a uno más eficiente.
Reduce las secciones visibles en la homepage. Cada sección del tema (slider, productos destacados, testimonios, Instagram feed, mapa, newsletter) añade peso. Prioriza las secciones que generan conversiones y elimina las decorativas.
Optimizar código personalizado
Si has añadido código personalizado al tema (CSS, JavaScript, integraciones), revisa que esté optimizado. El código CSS inline en el header o los scripts que bloquean el renderizado son las causas más comunes de bajo rendimiento.
Mueve los scripts no críticos al final del body con el atributo defer. Carga las hojas de estilo de fuentes personalizadas con font-display: swap para evitar el parpadeo de texto invisible (FOIT).
Los píxeles de seguimiento (Facebook, Google Ads, TikTok) impactan en el rendimiento. Usa Google Tag Manager para centralizar todos los scripts de tracking y configúralo para cargar de forma asíncrona.
- Scripts con defer o async para carga no bloqueante
- Centralizar tracking en Google Tag Manager
- Usar font-display: swap en fuentes personalizadas
- Eliminar CSS no utilizado del tema
- Minimizar el uso de scripts inline
Lazy loading y carga diferida
Shopify OS 2.0 incluye lazy loading nativo para imágenes, pero no todas las secciones del tema lo implementan correctamente. Verifica que las imágenes below-the-fold tengan el atributo loading="lazy" y que las above-the-fold no lo tengan (deben cargarse inmediatamente).
Para secciones pesadas como feeds de Instagram, vídeos embebidos o mapas de Google, implementa una carga diferida que solo los renderice cuando el usuario haga scroll hasta esa zona. Esto puede reducir el tiempo de carga inicial en varios segundos.
El video embebido de YouTube o Vimeo en la homepage es un problema frecuente. En lugar de embeber el player directamente, muestra una imagen de preview y carga el video solo cuando el usuario hace clic.
Puntos clave
- Las apps son el principal factor de lentitud: audita y elimina las innecesarias
- Comprime las imágenes antes de subirlas, aunque Shopify las optimice después
- Elige un tema optimizado (Dawn o temas oficiales de Shopify) como base
- Mueve scripts no críticos al final con defer y centraliza tracking en GTM
- Implementa lazy loading para secciones pesadas below-the-fold
- El Speed Score de Shopify apunta a 70+: mide y optimiza regularmente
¿Quieres una tienda Shopify más rápida?
Auditamos tu tienda Shopify, identificamos los cuellos de botella y aplicamos optimizaciones de rendimiento. Mejora tu Speed Score y la experiencia de tus clientes.
Solicitar presupuesto