Optimice lo que el almacenamiento en caché no puede solucionar: automáticamente
El almacenamiento en caché de Shopify maneja la entrega de activos de manera eficiente. El cuello de botella en el desempeño que enfrentan la mayoría de las tiendas es lo que sucede después Llegan recursos almacenados en caché: JavaScript que bloquea el procesamiento, CSS no optimizado y carga de recursos mal ordenada. Realiza una prueba de velocidad gratuita en tu tienda para ver dónde se gasta realmente el tiempo de carga.
Thunder Page Speed Optimizer se centra en estas optimizaciones posteriores al caché:
- Pospone JavaScript no crítico para que el navegador muestre primero el contenido visible
- CSS crítico integrado: no se necesita un viaje de ida y vuelta adicional ni siquiera en un caché frío
- Optimiza el orden de carga de recursos para una pintura con contenido más grande más rápida
- Administra scripts de aplicaciones de terceros que omiten la capa de almacenamiento en caché de Shopify
Comprender el almacenamiento en caché le ayuda a tomar mejores decisiones sobre la elección de temas, la gestión de aplicaciones y las prioridades de rendimiento. Analicemos cada capa de almacenamiento en caché.
Capa 1: Almacenamiento en caché del navegador en Shopify
Browser caching stores files locally on the visitor's device after the first download. When they visit again (or navigate to another page), the browser loads these files from disk instead of re-downloading them. This is the most impactful caching layer for returning visitors.
Qué Shopify almacena en caché en el navegador
| Tipo de activo | Duración de la caché | Dominio |
|---|---|---|
| Tema CSS/JS | 1 año (nombres de archivos versionados) | cdn.shopify.com |
| Imágenes del producto | 1 año | cdn.shopify.com |
| Fuentes | 1 año | cdn.shopify.com |
| Activos estáticos de la aplicación | Varía (depende de la aplicación) | Varios dominios CDN |
| páginas HTML | Sin caché del navegador (o muy corto) | tutienda.myshopify.com |
Usos de Shopify URL dirigidas a contenido para recursos del tema. Cuando editas el CSS de tu tema, Shopify genera un nuevo nombre de archivo (como tema.css?v=123456), que obliga a los navegadores a descargar la nueva versión. El caché de 1 año de la versión anterior se vuelve irrelevante porque la URL cambió.
Esto significa que nunca tendrás que preocuparte de que los visitantes vean CSS o JavaScript obsoletos después de una actualización del tema: la detección de caché de Shopify lo maneja automáticamente.
Por qué HTML no se almacena en caché del navegador
Las páginas HTML contienen contenido dinámico: recuento de artículos del carrito, nombre del cliente, productos vistos recientemente y precios que pueden cambiar. El almacenamiento en caché de HTML en el navegador mostraría datos obsoletos. Shopify envía Control de caché: sin caché o corto edad máxima encabezados para HTML para garantizar que los visitantes siempre obtengan contenido nuevo de la página.
Aquí es donde el caché perimetral CDN de Shopify toma el control: ofrece HTML nuevo rápidamente sin tener que acceder al servidor de origen cada vez.
Capa 2: Almacenamiento en caché perimetral de CDN de Cloudflare
Shopify se asocia con Cloudflare, cuyo CDN tiene Más de 300 nodos de borde en todo el mundo. Esta es la capa que hace que Shopify Tiempo hasta el primer byte (TTFB) muy competitivo: normalmente entre 200 y 600 ms, y las páginas almacenadas en caché responden entre 50 y 150 ms.
Cómo funciona el almacenamiento en caché perimetral de CDN
When a visitor requests a page, the request goes to the nearest Cloudflare edge node. If that node has a cached copy, it responds immediately — no round trip to Shopify's origin servers needed. If not, the edge node fetches the page from Shopify, serves it to the visitor, and stores a copy for subsequent requests.
Flujo de solicitud: acierto o error de caché de borde
Qué se almacena en caché en el borde (y qué no)
Desde 2023, Shopify ha ampliado el almacenamiento en caché de borde HTML para visitantes anónimos. Esto es lo que califica:
✅ Almacenamiento en caché desde el borde
- Página de inicio (visitantes anónimos)
- Páginas de colección
- Páginas de productos (anónimas)
- Publicaciones y artículos de blog
- Páginas estáticas (Acerca de, Contacto)
- Todos los recursos estáticos (imágenes, CSS, JS, fuentes)
❌ No se puede almacenar en caché desde el borde
- Páginas de clientes que han iniciado sesión
- Página de carrito (única por sesión)
- Pago (siempre dinámico)
- Páginas con cookies de sesión únicas
- Modo de vista previa del tema
- Páginas con Liquid dinámico que fuerza la falta de caché
Puede verificar el estado de la caché marcando el estado-de-cache-cf encabezado de respuesta en DevTools. Vea nuestro Puntos de referencia de velocidad de Shopify sobre cómo el almacenamiento en caché afecta las cifras de rendimiento del mundo real.
Capa 3: Almacenamiento en caché a nivel de aplicación
Las aplicaciones individuales de Shopify pueden implementar sus propias estrategias de almacenamiento en caché para los datos que ofrecen. Esta es la capa más variable y la que puede ayudar o perjudicar el rendimiento de su tienda.
Cómo funciona el almacenamiento en caché de aplicaciones
Las aplicaciones que muestran contenido en su tienda (widgets de revisión, recomendaciones de productos, ventanas emergentes de ventas adicionales) generalmente realizan llamadas API a sus propios servidores. Las aplicaciones bien diseñadas almacenan en caché estas respuestas:
- Buenas aplicaciones almacena en caché las respuestas de la API en su CDN, ofrece HTML de widget estático siempre que sea posible y carga de forma asincrónica para que no bloqueen la representación de la página.
- Aplicaciones mal construidas realice nuevas llamadas API en cada carga de página, inyecte scripts sincrónicos que bloqueen la representación y no almacene nada en caché
El problema: no tienes visibilidad de cómo las aplicaciones manejan el almacenamiento en caché internamente. Un widget de revisión puede almacenar en caché las revisiones durante 5 minutos o recuperarlas cada vez; no hay forma de saberlo sin inspeccionar las solicitudes de red.
Scripts de aplicaciones y el problema de omitir el almacenamiento en caché
La mayoría de las aplicaciones de Shopify inyectan JavaScript a través de Etiqueta de secuencia de comandos or app embed blocks. These scripts load from external domains (not cdn.shopify.com), which means:
- Requieren conexiones y búsquedas de DNS independientes (agrega entre 100 y 300 ms por dominio)
- Sus encabezados de caché están controlados por el desarrollador de la aplicación, no por Shopify.
- Pueden inyectar solicitudes adicionales que omiten todo el almacenamiento en caché de Shopify.
- Algunas aplicaciones agregan scripts de bloqueo de renderizado que retrasan la visualización de la página incluso cuando la página misma está almacenada en caché
Esta es exactamente la razón por la que una tienda puede tener un almacenamiento en caché CDN perfecto y aún así sentirse lento: third-party scripts from apps crean cuellos de botella en el rendimiento que el almacenamiento en caché por sí solo no puede resolver.
Cuando se rompe el almacenamiento en caché de Shopify: escenarios comunes
Comprender cuándo no se aplica el almacenamiento en caché le ayuda a diagnosticar problemas de rendimiento:
Modo de vista previa del tema
Cuando obtienes una vista previa de los cambios de tema, Shopify desactiva el almacenamiento en caché perimetral por completo. Esta es la razón por la que tu tienda se siente más lenta en el editor de temas: estás viendo respuestas de origen sin caché. No juzgues el rendimiento según el modo de vista previa.
Inmediatamente después de las actualizaciones de contenido
Cuando actualizas un producto, editas una página o publicas una publicación de blog, Shopify invalida la caché CDN correspondiente. El primer visitante después de una actualización ve un MISS de caché (respuesta de origen). Los visitantes posteriores obtienen la versión actualizada en caché. Por lo general, esto se resuelve en segundos.
Geolocalización y Detección de Moneda
Las tiendas que utilizan precios basados en geolocalización, cambio de moneda o contenido específico de una región pueden ver reducida la efectividad de la caché perimetral. Si cada región geográfica tiene precios diferentes, la CDN necesita versiones en caché separadas por región, lo que reduce las tasas de aciertos de la caché.
Aplicaciones de personalización y pruebas A/B
Las aplicaciones que modifican el contenido de la página en función de segmentos de visitantes (pruebas A/B, recomendaciones personalizadas) crean efectivamente variantes de página únicas. Esto puede evitar el almacenamiento en caché perimetral porque el contenido varía según el visitante. Cuanta más personalización agregue, menos efectivo será el almacenamiento en caché de CDN.
Páginas de poco tráfico
Edge caches have limited storage. Pages that rarely get visited may be evicted from the cache between visits, resulting in more cache MISSes. High-traffic pages (homepage, popular products) maintain warm caches; long-tail product pages with few visitors may consistently miss.
Lo que los comerciantes realmente pueden optimizar más allá del almacenamiento en caché
Como no puedes configurar el almacenamiento en caché de Shopify directamente, concéntrate en lo que Control puede : el rendimiento del front-end que determina la rapidez con la que se procesa su tienda después de que llegan los activos almacenados en caché.
| Optimización | Impacto | Tu control |
|---|---|---|
| Configuración de caché CDN | Alto | Ninguno: Shopify lo administra |
| Encabezados de caché del navegador | Medio | Ninguno: automático para activos de Shopify |
| Aplazamiento de recursos de bloqueo de renderizado | Muy Alto | Completo: mediante código de tema o Trueno |
| Incorporación de CSS crítico | Alto | Completo: mediante código de tema o Trueno |
| Optimización de imagen | Alto | Completo: tamaño, carga diferida, formatos |
| Gestión de scripts de aplicaciones | Alto | Parcial: eliminar aplicaciones no utilizadas, posponer secuencias de comandos |
| Sugerencias de recursos (preconexión, precarga) | Medio | Completo: mediante código de tema |
El patrón es claro: el almacenamiento en caché del lado del servidor es trabajo de Shopify; El rendimiento inicial es su trabajo. Incluso con un almacenamiento en caché perfecto, un tema que carga 2 MB de JavaScript que bloquea el procesamiento se sentirá lento. Incluso sin almacenamiento en caché, una interfaz bien optimizada se procesa rápidamente.
Thunder Page Speed Optimizer automatiza las optimizaciones de front-end en las filas verdes de arriba, las que tienen el mayor impacto y que usted realmente controla. Vea nuestro guía completa de optimización de velocidad para la estrategia completa.
Lista de verificación de optimización del almacenamiento en caché de Shopify
Si bien no puedes configurar el almacenamiento en caché directamente, estas acciones maximizan su efectividad:
- Audita tus aplicaciones instaladas : elimine aquellos que no generen ingresos de forma activa. Menos aplicaciones = menos scripts de terceros sin pasar por la capa de caché.
- Verificar tasas de aciertos de caché : use Chrome DevTools para verificar
estado-de-cache-cf: HITen sus páginas clave. Las bajas tasas de aciertos sugieren que la personalización o el contenido dinámico impiden el almacenamiento en caché. - Minimizar la personalización en las páginas de destino : Mantenga su página de inicio y sus páginas de colección lo más "anónimas" posible para obtener el máximo beneficio de caché perimetral.
- Uso carga diferida para imágenes : incluso las imágenes almacenadas en caché requieren tiempo de renderizado. La carga diferida pospone las imágenes fuera de la pantalla para que el navegador se centre primero en el contenido visible.
- Instale Thunder para optimización del front-end : automatizar el aplazamiento de JavaScript, la incorporación de CSS crítico y la priorización de recursos. Instalar ahora
- Test from your customers' perspective — Usar nuestro test de velocidad gratuito or WebPageTest from geographic locations matching your customer base.
- No juzgues la velocidad en la vista previa del tema : el modo de vista previa desactiva el almacenamiento en caché. Pruebe en la tienda en vivo o utilice PageSpeed Insights.
Preguntas frecuentes sobre el almacenamiento en caché de Shopify
¿Shopify utiliza el almacenamiento en caché del navegador?
Yes. Shopify serves static assets (images, CSS, JavaScript, fonts) with long Cache-Control headers — typically max-age=31536000 (1 year) for versioned assets on cdn.shopify.com. This means repeat visitors load these files from their browser's local cache instead of re-downloading them. HTML pages receive shorter cache durations or no-cache headers because they contain dynamic content like cart state and personalized elements.
¿Puedo controlar el almacenamiento en caché CDN de Shopify?
No. Shopify administra su configuración CDN de Cloudflare automáticamente. No puede configurar encabezados de caché personalizados, purgar el caché CDN ni configurar reglas de almacenamiento en caché perimetral. Shopify determina qué páginas califican para el almacenamiento en caché perimetral en función de si el visitante es anónimo (almacenable en caché) o si ha iniciado sesión (no almacenable en caché). La ventaja es que no necesitas preocuparte por la invalidación del caché: Shopify se encarga de ello cuando actualizas productos, colecciones o archivos de temas.
¿Por qué mi tienda Shopify muestra contenido diferente a diferentes usuarios si el almacenamiento en caché está activo?
Shopify's caching is smart about personalization. HTML edge caching only applies to anonymous visitors. When a customer logs in, adds items to their cart, or has cookies that indicate a unique session, Shopify bypasses the edge cache and generates a fresh page from the origin server. This ensures logged-in customers see their correct cart, account details, and personalized recommendations while anonymous browsers get the fast cached version.
¿Las aplicaciones de Shopify afectan el rendimiento del almacenamiento en caché?
Yes, in two ways. First, apps that inject dynamic, personalized content (like recently viewed products or geolocation-based pricing) can prevent pages from being edge-cached because the content varies per visitor. Second, apps add their own JavaScript and CSS files that the browser must download — though these static app assets are typically cached on Shopify's CDN after the first load. Reducing unnecessary apps improves both cache hit rates and overall load time.
How do I know if my Shopify pages are being served from cache?
Open Chrome DevTools (F12), go to the Network tab, and reload your page. Click the main HTML document request and check the response headers. Look for 'cf-cache-status' — a value of 'HIT' means Cloudflare served the page from edge cache, 'MISS' means it went to Shopify's origin server, and 'DYNAMIC' means the page isn't eligible for edge caching. For static assets on cdn.shopify.com, you'll typically see 'HIT' after the first load.
¿Borrar la memoria caché de mi navegador afecta la velocidad de mi tienda Shopify para los clientes?
No. Borrar la caché de tu propio navegador solo afecta tu experiencia local. Los cachés del navegador de sus clientes son independientes. Sin embargo, si está probando la velocidad de su tienda, borrar su caché le brindará una experiencia de "primera visita", útil para comprender lo que experimentan los nuevos visitantes. Para realizar pruebas de velocidad precisas, utilice el modo incógnito o herramientas como PageSpeed Insights que simulan visitas sin caché.
El almacenamiento en caché es el punto fuerte de Shopify: el rendimiento del front-end es tuyo
El sistema de almacenamiento en caché de tres capas de Shopify (navegador, borde CDN y nivel de aplicación) maneja el servidor y la entrega automáticamente. Los activos estáticos obtienen encabezados de caché del navegador durante un año. Las páginas HTML anónimas se almacenan en caché en más de 300 nodos de Cloudflare. No es necesario configurar nada de esto.
La verdadera oportunidad de rendimiento es la optimización del front-end: cómo su tema presenta el contenido después de que llegan los recursos almacenados en caché. Recursos de bloqueo de renderizado, no optimizado Entrega de CSS, y pesado scripts de terceros son los cuellos de botella que el almacenamiento en caché no puede resolver.
Prueba la velocidad de tu tienda ahora para ver qué tan eficientemente se procesa su tienda; luego, deje que Thunder optimizar las partes que el almacenamiento en caché deja en la mesa. Para conocer la estrategia de optimización completa, consulte nuestra guía completa de optimización de velocidad de Shopify.
Expert Speed Optimization for Your Store
Our team handles everything — theme optimization, app cleanup, Core Web Vitals guarantee. Most stores optimized in 2 weeks.
✅ Core Web Vitals Guarantee · ⚡ 2-Week Delivery · 🎁 6 Months Free Thunder
Starting from €1,500 · Learn more