10 consejos para acelerar tu tienda Shopify
Cada segundo adicional de carga le cuesta ventas a tu tienda. Google reporta que la probabilidad de rebote aumenta un 32 % cuando el tiempo de carga pasa de 1 a 3 segundos. En móvil, donde llega más del 70 % del tráfico de Shopify, el impacto es todavía mayor.
La buena noticia: no necesitas ser desarrollador para mejorar la velocidad de tu tienda. Estos 10 consejos cubren las causas más comunes de lentitud en Shopify y cómo resolverlas.
Contenido
- 1. Optimizar imágenes
- 2. Reducir apps instaladas
- 3. Limitar fuentes personalizadas
- 4. Activar lazy loading
- 5. Optimizar videos
- 6. Elegir un theme rápido
- 7. Minimizar scripts de terceros
- 8. Revisar redirecciones
- 9. Optimizar la sección hero
- 10. Medir regularmente
- Apps que no afectan la velocidad
- Preguntas frecuentes
- Lectura adicional
1. Optimizar imágenes
Las imágenes son la causa número uno de páginas lentas en Shopify. Una foto de producto sin comprimir puede pesar 3 MB o más. Multiplica eso por 10 imágenes en una página de producto y tienes 30 MB de descarga.
Shopify convierte las imágenes a formato WebP automáticamente, pero eso no resuelve todo. Antes de subir, redimensiona las fotos a un máximo de 2048 px en el lado más largo. Usa herramientas como TinyPNG o Squoosh para comprimir sin perder calidad visible. Lo ideal es que cada imagen pese menos de 200 KB.
Si asignas múltiples imágenes por variante, el filtrado de galería ayuda porque el navegador solo necesita renderizar las fotos de la variante seleccionada, no todas.
2. Reducir apps instaladas
Cada app que instalas puede agregar JavaScript y CSS a tu tienda. Algunas agregan poco. Otras cargan scripts pesados en cada página, incluyendo páginas donde la app ni siquiera se usa.
Revisa tu lista de apps y desinstala las que no uses. Presta atención: desactivar una app no siempre es suficiente. Algunas dejan código residual en tu theme después de desinstalarlas. Revisa si quedaron snippets o assets en tu theme y elimínalos manualmente si es necesario.
Al elegir apps nuevas, busca las que usen metafields en lugar de scripts externos. Las apps basadas en metafields cargan los datos con la página sin necesidad de llamadas adicionales a servidores.
3. Limitar fuentes personalizadas
Las fuentes personalizadas de Google Fonts u otros servicios agregan solicitudes HTTP adicionales y archivos tipográficos que el navegador debe descargar. Cada peso (regular, bold, italic) es un archivo aparte.
Limita las fuentes a dos familias como máximo. Usa solo los pesos que realmente necesitas (regular y bold en la mayoría de los casos). Si tu theme permite fuentes del sistema, considera usarlas para el texto del cuerpo. Son instantáneas porque ya están instaladas en el dispositivo del cliente.
4. Activar lazy loading
Lazy loading significa que las imágenes solo se cargan cuando están a punto de entrar en la pantalla del cliente. Las fotos al final de la página no se descargan hasta que el usuario se desplaza hasta ellas.
La mayoría de los themes modernos de Shopify incluyen lazy loading por defecto. Verifica que esté activo en la configuración de tu theme. Si usas un theme más antiguo, este cambio puede reducir significativamente el tiempo de carga inicial.
5. Optimizar videos
Los videos incrustados directamente en tu tienda pueden ser muy pesados. Un video de fondo en la sección hero que se reproduce automáticamente puede agregar varios megabytes a la carga inicial.
Usa YouTube o Vimeo para alojar tus videos en lugar de subirlos directamente a Shopify. Los reproductores embebidos cargan de forma diferida y no bloquean el renderizado de la página. Si necesitas un video de fondo, mantenlo por debajo de los 10 segundos y en una resolución razonable (720p suele ser suficiente para fondos).
6. Elegir un theme rápido
No todos los themes son iguales en rendimiento. Los themes gratuitos de Shopify (Dawn, Horizon, Sense, Craft) están optimizados para velocidad. Themes premium con muchas funciones integradas (sliders, animaciones, mega menús) tienden a ser más pesados.
Si la velocidad es prioridad, empieza con un theme ligero y agrega funcionalidades mediante apps específicas en lugar de elegir un theme que lo incluya todo. Un theme simple con apps bien construidas suele ser más rápido que un theme complejo con todo integrado.
7. Minimizar scripts de terceros
Chat en vivo, píxeles de seguimiento, herramientas de analítica, pop-ups de suscripción. Cada uno agrega JavaScript que el navegador debe descargar, analizar y ejecutar. Algunos bloquean el renderizado de la página hasta que terminan de cargar.
Revisa qué scripts de terceros tienes activos. Si un script no genera valor medible, elimínalo. Para los que necesitas, verifica si ofrecen carga asíncrona o diferida para que no bloqueen la página.
8. Revisar redirecciones
Cada redirección agrega una solicitud HTTP adicional. Si tienes cadenas de redirecciones (A redirige a B que redirige a C), el tiempo se multiplica. Esto es común cuando cambias URLs de productos o colecciones sin actualizar los enlaces internos.
En tu admin de Shopify, ve a Tienda online > Navegación > Redirecciones de URL. Revisa que no haya cadenas. Actualiza los enlaces internos de tu tienda para que apunten directamente a la URL final.
9. Optimizar la sección hero
La sección hero (el banner principal) es lo primero que el cliente ve. Si la imagen del hero es pesada, la percepción de velocidad cae. El cliente ve una pantalla en blanco o un espacio vacío durante la carga.
Comprime la imagen del hero agresivamente. Para un banner a ancho completo, 1600 px de ancho con compresión al 80 % suele ser suficiente. Evita videos de fondo en el hero a menos que sean fundamentales para tu marca.
10. Medir regularmente
Shopify incluye un reporte de velocidad en el admin (Tienda online > Velocidad). Usa PageSpeed Insights de Google para obtener métricas detalladas. Las métricas clave son Largest Contentful Paint (LCP), First Input Delay (FID) y Cumulative Layout Shift (CLS).
Mide después de cada cambio significativo: nueva app, nuevo theme, nuevas imágenes. No confíes solo en la puntuación numérica. Un score de 50 con un LCP de 2 segundos es mejor que un score de 70 con un LCP de 4 segundos. Lo que importa es la experiencia real del cliente.
Apps que no afectan la velocidad
No todas las apps ralentizan tu tienda. Rubik Variant Images almacena los datos de muestras de color en metafields de Shopify. Los datos se cargan con la página sin llamadas a APIs externas. Las muestras se renderizan en Shadow DOM, lo que evita conflictos de CSS y elimina re-renderizados del theme.
Al evaluar apps, busca las que cumplan estos criterios: datos basados en metafields, sin scripts que bloqueen el renderizado, sin llamadas a servidores externos después de la carga inicial. Esas son las que mantienen tu tienda rápida.
Más sobre cómo funciona el filtrado de galería de Rubik sin afectar la velocidad.
Preguntas frecuentes
¿Cuál es una buena puntuación de velocidad en Shopify?
Lo importante no es el número sino las métricas reales. Apunta a un LCP por debajo de 2,5 segundos y un CLS menor a 0,1. La puntuación de Shopify entre 50 y 70 es normal para tiendas con funcionalidades estándar.
¿Las apps de muestras de color hacen más lenta mi tienda?
Depende de la app. Las que usan metafields y Shadow DOM (como Rubik Variant Images) no generan impacto medible. Las que hacen llamadas a APIs externas en cada carga de página sí pueden afectar la velocidad.
¿Debería usar un CDN adicional?
No. Shopify ya usa Cloudflare como CDN para todas las tiendas. Tus imágenes, scripts y hojas de estilo ya se sirven desde servidores distribuidos globalmente. Agregar otro CDN no mejora la situación.
¿Cuántas apps puedo tener sin afectar la velocidad?
No hay un número mágico. Una app mal construida puede ser peor que 10 apps bien hechas. Evalúa cada app individualmente. Si no la usas, desinstálala. Si la usas, verifica que no agregue scripts pesados a todas las páginas.
¿El tamaño de mi catálogo afecta la velocidad?
El número total de productos no afecta la velocidad de páginas individuales. Lo que importa es cuánto contenido (imágenes, scripts, estilos) se carga en cada página. Una página de producto con 5 fotos optimizadas carga igual de rápido en una tienda de 10 productos que en una de 10.000.
¿Comprimir imágenes reduce la calidad?
Con compresión al 80 %, la diferencia visual es imperceptible para la mayoría de los clientes. Herramientas como TinyPNG aplican compresión inteligente que reduce el peso sin degradar visiblemente la imagen.
Lectura adicional
