Mejorar la velocidad de tu tienda online

Varios factores afectan la velocidad de tu tienda online, puedes controlar algunos.

Si no conoces la rapidez de rendimiento actual de tu tienda online, consulta el informe de Velocidad de tu tienda online.

Factores que no puedes controlar

El dispositivo, la red y la ubicación de tu cliente

Los clientes que visitan tu tienda viven en distintas partes del mundo y usan diferentes dispositivos y conexiones a internet. Es así que tu tienda podría cargarse de forma más rápida o lenta según estos factores.

Si un cliente te consulta sobre la velocidad de tu tienda, pídele que compruebe si se está en la última versión de su navegador, si recién eliminaron su caché y que su proveedor de servicios de internet no esté experimentando interrupciones o rendimientos deficientes.

Infraestructura de Shopify

Shopify aloja tu tienda online en servidores mundiales rápidos y no limita el ancho de banda de tu tienda. Puedes verificar el estado de tu tienda Shopify en el Estado de Shopify.

A continuación se presentan algunas funciones que afectan la velocidad de tu tienda online.

Red de entrega de contenido (CDN)

CDN significa red de entrega de contenido. Shopify ofrece a los comerciantes una red CDN de primera clase ejecutada por Fastly que garantiza la carga rápida de tu tienda online en todo el mundo. Puedes verificar el estado de CDN en la Página de estado de Fastly.

Caché del navegador local

Tu tienda almacena o guarda temporalmente algunos elementos en el almacenamiento local de tu cliente. La próxima vez que tu cliente visite tu tienda online, el navegador puede cargar recursos del caché en lugar de enviar otra solicitud al servidor.

Shopify establece la memoria caché del navegador para recursos almacenables en caché en tu tienda hasta un año por cada archivo. Los archivos almacenables incluyen archivos de imagen, PDFs, archivos JS y CSS.

Caché de página ejecutado por el servidor

Además del caché del navegador local, Shopify almacena páginas en el servidor. La primera vez que se carga una página, es posible que sea más lenta, pero las cargas posteriores son más rápidas porque los clientes reciben una copia almacenada en caché.

Los recursos dentro de la etiqueta Liquid content_for_header

La etiqueta Liquid {% content_for_header %} inserta los recursos usados por una variedad de funciones de la tienda online, incluyendo las estadísticas de rendimiento y las funciones opcionales como botones de pago dinámico. Cargar esta etiqueta y los recursos asociados afecta la velocidad de tu tienda. Shopify está optimizando la etiqueta y sus recursos para que sea más rápida.

Factores que puedes controlar

A continuación, se presentan algunos factores que pueden afectar la velocidad de tu tienda online y cómo puedes corregirlos.

Aplicaciones

Cuando agregas aplicaciones para cambiar la funcionalidad o apariencia de tu tienda en línea, agregan código al tema para que puedan ejecutarse. Se puede eliminar o reordenar algún código para mejorar el rendimiento de tu tienda online. Si no estás utilizando una aplicación, puedes eliminarla.

Si crees que una aplicación está ralentizando tu tienda, sigue los pasos siguientes:

Temas

Los temas están conformados por códigos Liquid, HTML, CSS y JavaScript. Cuando editas o personalizas temas, los tamaños de archivo pueden aumentar y afectar la velocidad de tu tienda.

Si crees que algo en tu tema está ralentizando tu tienda, sigue los pasos siguientes:

Funciones del tema o de la aplicación

Ciertas funciones, cuando están habilitadas, también pueden afectar la velocidad de tu tienda. Por ejemplo, algunas ventanas emergentes de vista rápida cargan previamente la información de cada página de producto al cargar una página de colección. Cargar datos adicionales que tus clientes no usen puede afectar la velocidad de tu tienda sin agregar valor.

Si crees que una función está ralentizando tu tienda, sigue los siguientes pasos:

Código de Liquid complejo o ineficiente

Puedes editar casi todo el Liquid que se usa para renderizar tu tienda. Existen formas eficaces e ineficaces de escribir un código de Liquid. Repetir operaciones complejas puede aumentar el tiempo de renderización de Liquid, afectando la velocidad total de tu tienda.

Por ejemplo, si deseas ordenar por precio los productos de una colección, debes hacerlo antes de hacer un bucle en los productos de tu colección, y no como parte del código de bucle. Esto se debe a que el orden no cambia para cada producto, y calcularlo aumenta el tiempo de procesamiento de la solicitud.

Si te preocupa que tu código no esté optimizado, puedes seguir los pasos siguientes:

Imágenes y videos

Las imágenes de gran tamaño y las que se ocultan a la vista pueden interferir con la carga de otras partes más importantes de una página. Si los usuarios tienen que esperar a que se carguen imágenes grandes, quizá piensen que tu tienda es lenta.

Shopify agrega algunas medidas de seguridad para evitar que sobrecargues tu tienda online con imágenes o videos. Por ejemplo:

  • No puedes tener más de 50 productos en una página de colección o 25 secciones en tu página de inicio.
  • Muchos temas posponen la carga de imágenes que actualmente no están en la pantalla.
  • Muchos temas también cargan un tamaño específico de una imagen en función del tamaño de pantalla en el que se muestra.

Sin embargo, estas medidas de seguridad no evitan por completo que las imágenes o videos afecten el rendimiento de tu tienda online.

Si crees que las imágenes están ralentizando tu tienda, sigue los siguientes pasos:

  • Revisa la guía de optimización de imágenes.
  • Mantén las presentaciones de diapositivas de imágenes destacadas en 2-3 diapositivas o usa una imagen destacada.
  • Solicita a tu desarrollador de temas consejos sobre la mejor manera de usar imágenes con su tema.
  • Contrata un experto de Shopify para obtener más ayuda.

Herramientas de resolución de problemas

A continuación te presentamos las herramientas que puedes usar para investigar la velocidad de tu tienda online.

Lighthouse

El informe de velocidad de la tienda online de Shopify usa Lighthouse para medir la velocidad de tu tienda. Puedes publicar tu propio informe de Lighthouse usando las Percepciones de Google PageSpeed para ver métricas más detalladas de las páginas en tu tienda. Para más información sobre el significado de estas métricas, consulta la documentación de puntuación de rendimiento de Google Lighthouse. También puedes contratar a un experto de Shopify para ayudarte a comprender las métricas y sugerir mejoras.

Inspector de temas de Shopify para Chrome

El Inspector de temas de Shopify para Chrome es una herramienta de generación de perfiles que usa una gráfica de flama para mostrar el rendimiento de Liquid. Esta herramienta te ayuda a identificar las líneas de código que ralentizan las páginas en tu tienda online. Leer más sobre cómo usar el inspector de temas de Shopify.

Dónde obtener ayuda

Si usas un tema gratis de Shopify, el equipo de atención al cliente de Shopify podría ayudarte con las mejoras básicas de rendimiento.

Si usas un tema externo y necesitas ayuda, debes ponerte en contacto con tu desarrollador de tema o contratar un experto de Shopify.

Si tienes un equipo de desarrollo o un partner de agencia, también puedes contactarlos para obtener más ayuda.

¿Estas listo(a) para comenzar a vender con Shopify?

Pruébala gratis