Respuesta rápida: en la mayoría de las tiendas Shopify, el problema de velocidad son las aplicaciones y las imágenes, en ese orden, y la solución es eliminarlas y comprimirlas en lugar de una ingeniería ingeniosa. Ignora la puntuación de velocidad del administrador; mide el Largest Contentful Paint, Interaction to Next Paint y Cumulative Layout Shift de visitantes reales, porque esos son los que utiliza Google y los que correlacionan con la conversión.

Mide los tres números correctos

El administrador de Shopify muestra una puntuación de velocidad. Es una puntuación de laboratorio de Lighthouse — una carga simulada en un dispositivo simulado — y varía por razones que no tienen nada que ver con tus visitantes. Útil para comparar tu tienda consigo misma el mes pasado; no es lo que utiliza Google.

Google utiliza datos de campo: lo que realmente ocurrió a personas reales en conexiones reales.

Métrica Mide Aprobado Culpable habitual en Shopify
LCP Cuándo se pinta la imagen o encabezado principal < 2.5s Imagen principal cargada perezosamente, sin comprimir o detrás de un carrusel
INP Qué tan rápido responde la página a un toque < 200ms JavaScript de la aplicación ejecutándose en el hilo principal
CLS Cuánto salta el diseño < 0.1 Imágenes sin dimensiones, banners inyectados tarde, intercambio de fuentes

El informe de Core Web Vitals de Search Console muestra estos datos de tus propios visitantes. PageSpeed Insights muestra tanto datos de campo como de laboratorio para una URL — lee primero la sección de campo y trata la sección de laboratorio como un diagnóstico del por qué.

Las aplicaciones suelen ser la mayor carga

Cada aplicación que inyecta un script añade bytes para descargar, analizar y ejecutar, y lo hace en cada página, ya sea que esa página use la aplicación o no. Doce aplicaciones no son doce pequeños costes; son doce compitiendo por el mismo hilo principal.

Audita correctamente:

  1. Haz una lista de cada aplicación instalada y anota qué te aporta cada una. Cualquier cosa que no puedas justificar es candidata.
  2. Desinstala las candidatas.
  3. Luego revisa el tema en busca de restos. Este es el paso que la gente omite. Desinstalar una aplicación no siempre elimina la etiqueta de script que añadió a theme.liquid, por lo que podrías estar pagando el coste de carga de una aplicación que ya no tienes. Busca en el tema el nombre de la aplicación y el dominio CDN.
  4. Vuelve a medir después de cada eliminación, no al final, para saber cuál fue la que importó.

El simulador de Googlebot muestra el HTML bruto que recibe un rastreador, lo cual es una forma rápida de ver cuánto de tu página es script de terceros antes de que se renderice nada.

Imágenes: comprimir, dimensionar y evitar el lazy-loading en el hero

Las imágenes suelen ser los elementos más pesados en una página de Shopify y lo más fácil de reducir a la mitad.

El CDN de Shopify ya hace más de lo que la mayoría de los comerciantes se da cuenta. Sirve WebP automáticamente a los navegadores que lo aceptan y redimensiona a petición mediante parámetros de URL. Lo que no puede hacer es deshacer un original de 4 MB: servirá un formato más pequeño, no una fotografía más pequeña. Comprime antes de subir.

Dimensiona la solicitud al espacio. Una imagen de 2,400px mostrada en una columna de 600px desperdicia tres cuartas partes de sus bytes. Las URLs de imágenes de Shopify aceptan ?width= — úsalo y proporciona un srcset para que los teléfonos no descarguen imágenes de escritorio.

El hero es la excepción a toda regla de lazy-loading. Casi siempre es el elemento LCP, por lo que cargarlo de manera diferida retrasa la única imagen que Google está cronometrando. Configúralo con loading="eager" y fetchpriority="high", y carga de manera diferida todo lo que esté por debajo del pliegue. Las tiendas que "añaden lazy loading en todas partes" y se vuelven más lentas casi siempre han hecho exactamente esto.

Siempre establece ancho y alto. Sin ellos, el navegador no puede reservar espacio, la página se reestructura cuando llega la imagen, y eso es CLS. SEO de imágenes en Shopify cubre el lado del texto alternativo y el nombre del archivo; esto es puramente el lado del rendimiento.

Fuentes y el coste invisible

Las fuentes personalizadas tienen un coste real que se paga en cada primera visita. Tres reglas cubren la mayor parte:

  • Envía menos. Dos familias y dos pesos cada una es suficiente. Cuatro familias es una decisión de diseño con un coste en rendimiento.
  • font-display: swap. De lo contrario, el texto es invisible mientras se carga la fuente, una página en blanco que parece rota incluso cuando es rápida.
  • Preconectar al host de la fuente. Una línea en theme.liquid que ahorra una búsqueda DNS y un apretón de manos TLS en el camino crítico.

La propia biblioteca de fuentes de Shopify se sirve desde el mismo origen que la tienda, lo que elimina por completo el coste de conexión. Vale la pena considerarlo si la fuente de tu marca no es esencial.

Lo que no puedes arreglar y deberías dejar de intentar

Shopify controla el tiempo de respuesta del servidor, el CDN, el proceso de pago y el JavaScript de la plataforma central. No puedes ajustar nada de esto, y una parte significativa de cualquier informe de Lighthouse incluirá elementos de esta categoría.

Esto es importante para establecer expectativas: hay un límite, es el mismo límite para todas las tiendas en la plataforma, y un "servicio de optimización de velocidad" que promete superarlo está vendiendo otra cosa. Lo que realmente te pertenece es todo lo que ocurre después de que llega el HTML, y en una tienda con muchas aplicaciones, es ahí donde se encuentra casi toda la pérdida evitable.

Un plan ordenado

Semana 1 — medir y eliminar. Registra LCP, INP y CLS desde Search Console. Audita las aplicaciones, desinstala las injustificables, busca scripts sobrantes en el tema. Vuelve a medir.

Semana 2 — imágenes. Comprime y vuelve a subir las imágenes principales en tu página de inicio y colecciones destacadas. Añade ancho y alto explícitos. Corrige el atributo de carga de la imagen principal. Reduce las imágenes del carrusel a lo que realmente se ve.

Semana 3 — fuentes y terceros. Reduce las familias y pesos de las fuentes. Añade preconnect. Aplaza cualquier script de terceros restante que no sea necesario para la primera pintura.

Semana 4 — volver a medir y detenerse. Los datos de campo tienen un retraso de hasta 28 días, así que no juzgues la semana 1 en la semana 2. Cuando los tres números pasen, detente: más optimización en una tienda que ya pasa es un esfuerzo que rendiría más en otro lugar.

Dónde se sitúa la velocidad frente a todo lo demás

La velocidad es un factor de desempate. Una página rápida que responde mal a la consulta sigue perdiendo frente a una página lenta que responde bien, por eso "mejorar los Core Web Vitals" rara vez es la tarea de mayor valor en una tienda con 2,000 productos y sin meta descripciones.

Arréglalo porque los visitantes abandonan las tiendas lentas y porque es un factor real de clasificación, pero ordénalo con honestidad. La lista de verificación de SEO para Shopify lo coloca en orden frente al resto, y la auditoría gratuita te dirá si la velocidad es realmente tu limitación principal o simplemente lo más visible en lo que trabajar.