Mejorar la velocidad de tu tienda online

Esta página fue impresa el Dec 04, 2023. Para acceder a la versión actual, por favor visita https://help.shopify.com/es/manual/online-store/store-speed/improving-speed.

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.

En esta página

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 que utiliza la última versión de su navegador, que borró su caché recientemente y que su proveedor de servicios de Internet no está experimentando interrupciones ni un rendimiento deficiente.

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.

Shopify está constantemente mejorando su código e infraestructura. Algunas de estas mejoras podrían reflejarse en tu puntuación de velocidad.

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

Red de distribución de contenido (CDN)

CDN significa red de distribución de contenido. Shopify ofrece a los comerciantes una red CDN de primera clase ejecutada por Cloudfare 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 Cloudflare.

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 del objeto Liquid content_for_header

El objeto Liquid `` inserta los recursos que usan distintas funciones de la tienda online, por ejemplo, estadísticas de rendimiento y funciones opcionales como los botones de pago dinámicos. Cargar este objeto y los recursos relacionados afecta a 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:

  • Desactiva las funciones de la aplicación que no usas o elimina la aplicación si no la necesitas. Considera el equilibrio entre las funciones de la tienda online y la velocidad.
  • Si estás eliminando una aplicación, considera la posibilidad de eliminar el código que se agregó como parte del proceso de instalación de dicha aplicación. Algunas aplicaciones te ayudan con este proceso al incluir su código en las etiquetas {% comment %} que mencionan el nombre de la aplicación. Eliminar el código de la aplicación no utilizada es una práctica recomendada que evita la ejecución del código para funciones no utilizadas y facilita la lectura del código del tema.
  • Consulta a tu desarrollador de aplicaciones.
  • Contrata a un Shopify Partner para obtener más ayuda. Obtén más información sobre cómo contratar a un Shopify Partner.

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 activadas, también podrían 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 cargarse una página de colección. La carga de 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 recorrer en bucle 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 el código no esté optimizado, puedes seguir los pasos siguientes:

  • Ejecuta el Inspector de temas de Shopify para Chrome para identificar las líneas de código que ralentizan las páginas en tu tienda online.
  • Contrata a un Shopify Partner para que te ayude a encontrar un código ineficaz o inútil.

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 se muestran en 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 a un Shopify Partner para obtener más ayuda. Obtén más información sobre cómo contratar a un Shopify Partner.

Fuentes

Puedes elegir entre varias fuentes para el texto de tu tienda online. Sin embargo, si usas una fuente que todavía no existe en la computadora de tu cliente, debe descargarse la fuente antes de poder mostrar el texto. Esto afecta al tiempo de carga de tu tienda.

Para evitar que se descargue una fuente nueva en la computadora de tu cliente, puedes usar una fuente de sistema. Una fuente de sistema es una fuente que ya está instalada en la mayoría de las computadoras.

Puedes seleccionar una familia tipográfica mono, serif o sans-serif. Igual puedes usar estilos de fuente, como negrita o cursiva, cuando uses cualquiera de estas familias tipográficas.

La fuente que se muestra en la computadora de tu cliente depende de su sistema operativo. A continuación te presentamos algunos ejemplos de las fuentes que se pueden usar para renderizar el texto cuando seleccionas una familia tipográfica de sistema:

  • Mono: Menlo, Consolas, Monaco, Liberation Mono o Lucida Console
  • Sans-serif: BlinkMacSystemFont, Segoe UI, Roboto, Ubuntu o Helvetica Neue
  • Serif: Iowan Old Style, Apple Garamond, Baskerville, Times New Roman, Droid Serif, Times o Source Serif Pro

Herramientas de resolución de problemas

Puedes usar las siguientes herramientas para comprobar la velocidad de tu tienda online.

Si eres un desarrollador, puedes optimizar aún más tu tema para el rendimiento usando las herramientas y las mejores prácticas de Shopify. Más información en Shopify.dev.

Lighthouse

El informe Velocidad de tienda online de Shopify usa Lighthouse para medir la velocidad de la tienda. Puedes obtener tu propio informe de Lighthouse mediante Google PageSpeed Insights para ver métricas más detalladas de las páginas de la tienda. Para obtener 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 Shopify Partner para que te ayude a entender las métricas y te ofrezca sugerencias para mejorar. Obtén más información sobre cómo contratar a un Shopify Partner.

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. Aprende cómo usar el inspector de temas de Shopify.

Obtener ayuda con la velocidad de la tienda online

Si usas un tema gratis de Shopify, 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 el desarrollador de temas o contratar un Shopify Partner. Obtén más información sobre cómo contratar a un Shopify Partner.

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

¿Estás listo/a para comenzar a vender con Shopify?

Prueba gratis