La tienda llegó con un PageSpeed de 38 en móvil. El cliente sabía que era lento, pero no dimensionaba el impacto: estaban perdiendo conversiones en el paso entre el anuncio de Meta y la ficha de producto. Este es el proceso que usé para llevarlo a 95.

Diagnóstico inicial

Los tres culpables principales que aparecen en casi todos los casos de Shopify lento:

  • Apps de reviews, chat y popups cargando 8-12 scripts externos en el <head>
  • Imágenes en formato PNG/JPG sin compresión, algunas de 3MB+
  • Secciones de Liquid con lógica condicional compleja que no se cacheaba

Paso 1: Auditar y eliminar apps

Revisé cada app instalada contra Google Tag Manager para ver cuántas requests generaba cada una. De 14 apps activas, 6 no se usaban desde hacía meses pero seguían cargando scripts. Las desinstalé y el LCP cayó de 8.2s a 4.1s solo con eso.

Paso 2: Imágenes en WebP con lazy loading

Shopify tiene filtros de imagen nativos en Liquid. El problema es que el tema no los estaba usando. Reemplacé todas las etiquetas img del tema con la sintaxis correcta:

{%- comment -%} Antes {%- endcomment -%}
<img src="{{ product.featured_image | img_url: '800x' }}" alt="{{ product.title }}">

{%- comment -%} Después {%- endcomment -%}
<img
  src="{{ product.featured_image | image_url: width: 800, format: 'webp' }}"
  loading="lazy"
  width="800"
  height="{{ 800 | divided_by: product.featured_image.aspect_ratio | round }}"
  alt="{{ product.title | escape }}">

Paso 3: Defer de scripts no críticos

Todo script que no sea necesario para el primer render debe llevar defer o async. En Shopify esto se hace en el layout/theme.liquid. Los scripts de analytics, chat y remarketing los moví a cargar con un pequeño timeout para que no bloqueen el LCP:

// Cargar scripts no críticos después del primer render
window.addEventListener('load', function() {
  setTimeout(function() {
    var s = document.createElement('script');
    s.src = 'https://cdn.chat-app.com/widget.js';
    document.head.appendChild(s);
  }, 3000);
});

Resultado

PageSpeed móvil: 38 → 95. LCP: 8.2s → 1.4s. La tasa de conversión subió un 23% en el mes siguiente. Aunque no todo se debe solo al rendimiento — también ajustamos el copy del hero y simplificamos el checkout — la velocidad fue el cambio más grande.

Una app de reviews que nadie usa está costando 2 segundos de LCP. Eso es dinero real perdido cada día.