¿Qué son los recursos de bloqueo de renderizado?
Cuando su navegador carga una página de Shopify, lee el HTML de arriba abajo. Si encuentra una etiqueta <script> sin async ni defer, detiene el renderizado, descarga el script, lo ejecuta y después continúa. Lo mismo ocurre con las etiquetas <link rel="stylesheet"> para CSS externo: el navegador no mostrará el contenido hasta que descargue y analice el CSS.
Por eso tus visitantes ven una página blanca en blanco (o una página parcialmente cargada) durante varios segundos mientras el navegador procesa estos archivos en segundo plano. El navegador está literalmente bloqueado para renderizar contenido visible.
Tres tipos de recursos de bloqueo de renderizado en Shopify
Archivos JavaScript : guiones de temas, guiones de aplicaciones, rastreadores de análisis. El mayor infractor en la mayoría de las tiendas Shopify. Cada etiqueta de script sin aplazar detiene el procesamiento por completo.
Hojas de estilo CSS — Hojas de estilo externas cargadas en el <head>. El navegador debe descargar y analizar todo el CSS antes de pintar algo.
Fuentes web : fuentes personalizadas que deben descargarse antes de que se muestre el texto. sin visualización de fuente: intercambiar, el navegador muestra texto invisible hasta que llega la fuente.
En una tienda Shopify típica, la advertencia "Eliminar recursos que bloquean el procesamiento" en PageSpeed Insights representa 1 a 4 segundos de retraso. Cuantas más aplicaciones haya instalado, peor se pondrá: cada aplicación puede agregar múltiples scripts de bloqueo de renderizado.
Por qué esto es importante para tu tienda
Los recursos de bloqueo de renderizado no son solo un problema técnico: impactan directamente en tus ingresos:
7%
caída de conversión por 1 segundo de retraso
Fuente: Google/Deloitte
53%
de los visitantes móviles abandonan si una página tarda más de 3 segundos
Fuente: Google
SEO
Core Web Vitals es un factor de clasificación de Google desde 2021
Fuente: Centro de Búsqueda de Google
Si su tienda tarda 5 segundos en mostrar contenido debido a recursos que bloquean el procesamiento, está perdiendo visitantes incluso antes de que vean sus productos. Solucionar este problema es una de las optimizaciones de velocidad con mayor retorno de la inversión que puede realizar. Para obtener una visión más amplia de cada técnica de optimización, consulte nuestra guía completa de optimización de velocidad.
🆕 Actualización de 2026: INP reemplazó a FID como núcleo web vital
Desde marzo de 2024, Google utiliza INP (Interacción con la siguiente pintura) en lugar de FID para medir la capacidad de respuesta. Los scripts de bloqueo de renderizado perjudican a INP porque monopolizan el hilo principal, lo que hace que los toques, clics y desplazamientos parezcan no responder. La reparación de recursos que bloquean el procesamiento ahora mejora dos Core Web Vitals: LCP (pintura inicial más rápida) e INP (interacciones más receptivas). si tu la puntuación de velocidad bajó recientemente, los scripts que bloquean el procesamiento probablemente sean un factor. Lea nuestro Guía de elementos básicos de Web Vitals para ver la imagen completa.
La solución fácil: optimización automática con Thunder
Antes de sumergirnos en el manual, correcciones a nivel de código a continuación: hay una manera mucho más sencilla. Thunder Page Speed Optimizer detecta y repara automáticamente los recursos que bloquean el procesamiento en su tienda Shopify, sin necesidad de cambios de código.
Lo que Thunder soluciona automáticamente:
Aplazamiento del guión
Aplaza automáticamente los scripts de aplicaciones de terceros, incluso aquellos que no puedes controlar manualmente
Incorporación de CSS crítico
Extrae e inserta CSS en la mitad superior de la página para que su página se muestre al instante
Optimización de fuentes
Agrega visualización de fuentes: intercambia y precarga fuentes críticas automáticamente
Mapeo inteligente de dependencias
Entiende qué scripts dependen unos de otros: pospone de forma segura sin dañar las aplicaciones
Minificación de CSS
Elimina CSS no utilizado y comprime el resto para tamaños de archivos más pequeños
Monitoreo Continuo
Realiza un seguimiento diario de tu velocidad y te avisa si nuevas aplicaciones introducen recursos de bloqueo de renderizado
Mejora media: +27 puntos PageSpeed
Los usuarios de Thunder ven una mejora promedio de 27 puntos en su puntuación de Google PageSpeed. La mayoría de las tiendas pasan de rojo/naranja a verde a los pocos minutos de habilitar las optimizaciones.
Plan gratuito disponible · No se requiere tarjeta de crédito · Configuración de 30 segundos · Funciona con todos los temas · Ver todos los planes
¿Por qué utilizar una aplicación en lugar de arreglarla manualmente? Las correcciones manuales a continuación requieren editar archivos de temas de Liquid, comprender las dependencias de los scripts, generar CSS crítico y realizar pruebas exhaustivas. Un error puede arruinar tu pago o tus aplicaciones. También es necesario rehacerlo cada vez que instales una nueva aplicación o actualices tu tema. Thunder maneja todo esto de forma automática y continua.
Cómo identificar recursos que bloquean el procesamiento en su tienda
⚡ Omita este paso: El plan gratuito de Thunder identifica automáticamente todos los recursos que bloquean el procesamiento en su tienda y le muestra exactamente cuáles lo están ralentizando, sin necesidad de pruebas manuales.
Método 1: Google PageSpeed Insights
Ir a pagespeed.web.dev, ingresa la URL de tu tienda y espera el análisis. tu también puedes realiza una prueba de velocidad gratuita usando nuestra herramienta para obtener una descripción general rápida. En los resultados, desplácese hasta la sección "Oportunidades" y busque "Eliminar recursos que bloquean el procesamiento". Haga clic para expandirlo; verá todos los archivos que bloquean el procesamiento y el ahorro de tiempo estimado.
Método 2: Cobertura de Chrome DevTools
Abre tu tienda en Chrome, presiona F12, luego Ctrl+Mayús+P (o Cmd+Mayús+P en Mac) y escribe "Cobertura". Esto muestra qué cantidad de cada archivo CSS y JavaScript se utiliza realmente durante la carga. Barras rojas = código no utilizado que el navegador descargó pero que no necesitaba.
Método 3: Cascada de red
En la pestaña Chrome DevTools → Red, vuelva a cargar la página y observe el gráfico en cascada. Los archivos que se cargan temprano con barras largas bloquean la renderización. Concéntrese en los archivos JavaScript y CSS que se cargan antes de la primera imagen.
💡 Consejo: Prueba en móvil. Cambie Chrome DevTools a la emulación móvil antes de analizar. Los recursos de bloqueo de renderizado tienen un impacto mucho mayor en los dispositivos móviles debido a procesadores y conexiones más lentos; consulte nuestro Guía de optimización de la velocidad móvil de Shopify para más información sobre esto.
Solución manual: JavaScript que bloquea el procesamiento
⚠️ Dificultad: Intermedio a Avanzado. Editar un tema JavaScript requiere comprender las dependencias de los scripts, el orden de ejecución y las plantillas Liquid de Shopify. Los errores pueden afectar su pago, sus aplicaciones y su seguimiento. Siempre haga una copia de seguridad de su tema antes de realizar cambios.
JavaScript es el mayor culpable del bloqueo de renderizado en la mayoría de las tiendas Shopify. A continuación se explica cómo abordar cada tipo manualmente:
1. Agregar aplazar a secuencias de comandos personalizadas
Si ha agregado etiquetas de script personalizadas en sus archivos de tema (tema.liquido, archivos de sección, etc.), agregue el aplazar atributo:
<!-- ❌ Before: render-blocking -->
<script src="https://example.com/custom-script.js"></script>
<!-- ✅ After: non-render-blocking -->
<script src="https://example.com/custom-script.js" defer></script> defer indica al navegador: «Descarga el archivo en segundo plano y ejecútalo cuando el HTML se haya analizado por completo». Así conserva el orden de ejecución sin bloquear el renderizado.
2. Mover scripts al final
Para los scripts en línea (código entre etiquetas <script>), muévalos desde <head> hasta justo antes de </body>:
<!-- ❌ Antes: en <head>, renderizado de bloques -->
<head>
<guión>
// análisis o código de seguimiento
</script>
</head>
<!-- ✅ Después: antes </body>, se representa primero -->
<cuerpo>
<!-- ... contenido de la página ... -->
<guión>
// análisis o código de seguimiento
</script>
</cuerpo> 3. Usar asíncrono para guiones independientes
Para scripts que no dependen de otros scripts (como rastreadores de análisis independientes), asíncrono descarga y ejecuta sin bloquear, pero no garantiza el orden de ejecución:
<!-- ✅ Good for independent scripts like analytics -->
<script src="https://analytics.example.com/track.js" async></script>
<!-- ✅ Better for scripts with dependencies -->
<script src="https://cdn.example.com/library.js" defer></script>
<script src="https://cdn.example.com/app.js" defer></script> Cuándo usar cuál: Uso aplazar para la mayoría de los scripts: conserva el orden de ejecución. uso asíncrono solo para guiones verdaderamente independientes. En caso de duda, utilice aplazar.
Solución manual: CSS que bloquea el procesamiento
⚠️Dificultad: Avanzado. La extracción crítica de CSS es una de las optimizaciones de velocidad más difíciles de realizar correctamente. Hacerlo mal provoca un destello de contenido sin estilo (FOUC): su página aparece brevemente rota antes de que se carguen los estilos. Es por eso que la mayoría de los desarrolladores utilizan herramientas automatizadas para esto.
CSS bloquea inherentemente el renderizado: el navegador necesita saber cómo se ven las cosas antes de mostrarlas. No puede simplemente posponer todo el CSS (la página parpadearía sin estilo). El enfoque correcto:
1. CSS crítico en línea
CSS crítico es el CSS mínimo necesario para diseñar el contenido de la mitad superior de la página. Incorpórelo directamente en <head> para que el navegador muestre instantáneamente, luego cargue la hoja de estilo completa de forma asincrónica:
<head>
<!-- ✅ Critical CSS inlined for instant rendering -->
<style>
/* Only styles for above-the-fold content */
header {display:flex;align-items:center;height:64px}
.hero {padding:4rem 1rem;text-align:center}
.hero h1 {font-size:2.5rem;font-weight:800}
</style>
<!-- ✅ Full CSS loaded asynchronously -->
<link rel="preload" href="{{ "theme.css" | asset_url }}" as="style"
onload="this.onload=null;this.rel='stylesheet'">
<noscript><link rel="stylesheet" href="{{ "theme.css" | asset_url }}"></noscript>
</head> ¿La parte difícil? Determinar qué CSS es crítico. Es diferente para cada página (página de inicio, colección, producto) y cada tema. Herramientas como Critical por Addy Osmani pueden ayudar, pero deben ejecutarse para cada plantilla de página y actualizarse cada vez que cambie su tema.
2. Eliminar CSS no utilizado
Muchos temas de Shopify incluyen CSS para todas las funciones posibles (megamenús, acordeones, vista rápida) incluso si no los usas. Utilice la pestaña Cobertura de Chrome DevTools para medir. Si se utiliza menos del 50%, hay mucho margen de optimización. Pero eliminar CSS manualmente corre el riesgo de romper características que no sabías que existían.
3. Minimizar CSS externo
Cada archivo CSS externo (Google Fonts, hojas de estilo de aplicaciones, widgets) agrega una solicitud de bloqueo. Hospede fuentes automáticamente, combine pequeñas hojas de estilo y audite qué CSS de aplicación es realmente necesario. Emparejando estas correcciones de CSS con carga diferida adecuada garantiza que el navegador solo cargue lo necesario para la ventana gráfica inicial.
Solución manual: fuentes que bloquean el procesamiento
Las fuentes web causan dos problemas: bloquean la renderización de texto (FOIT — Flash of Invisible Text), y cargarlas desde dominios externos añade latencia de red adicional.
1. Usar visualización de fuente: intercambiar
Muestra el texto inmediatamente en una fuente alternativa y luego cambia a la fuente personalizada cuando esté lista:
@font-face {
font-family: 'YourCustomFont';
src: url('your-font.woff2') format('woff2');
font-weight: 400;
font-display: swap; /* ✅ Shows fallback text immediately */
} 2. Precargar fuentes críticas
Comience a descargar su fuente más importante temprano:
<link rel="preload" href="/fonts/your-font.woff2" as="font"
type="font/woff2" crossorigin> Precargue solo 1 o 2 fuentes críticas. Precargar demasiados desperdicia ancho de banda.
3. Autohospedaje en lugar de fuentes de Google
Cargando desde fonts.googleapis.com
La carpeta requiere búsquedas de DNS adicionales. El autohospedaje coloca fuentes en la CDN de Shopify:
- Descargar fuentes de Ayudante de fuentes web de Google
- Subir
.woff2archivos a la carpeta Activos de su tema - Actualizar CSS
@font-facepara hacer referencia a archivos locales - Elimine las etiquetas
<link>de Google Fonts.
4. Limitar el peso de las fuentes
Cada peso (normal, negrita, cursiva) es una descarga independiente. La mayoría de las tiendas sólo necesitan texto normal (400) y negrita (700). Cargar de 4 a 6 pesas agrega entre 200 y 600 KB innecesariamente.
El problema de los scripts de terceros (por qué las correcciones manuales no son suficientes)
Aquí está la dura verdad sobre todo lo anterior: las técnicas manuales funcionan muy bien para el código que usted controla, pero en la mayoría de las tiendas Shopify, los mayores infractores del bloqueo de renderizado son los scripts de aplicaciones de terceros que no se pueden editar.
Cuando una aplicación Shopify inyecta un <guión>
Etiquetas etiqueta en tu escaparate, no puedes elegir si tiene aplazar o asíncrono. El desarrollador de la aplicación tomó esa decisión, y muchos no agregan ninguna de las dos, lo que hace que sus scripts bloqueen el procesamiento de forma predeterminada.
Una tienda Shopify típica tiene entre 5 y 15 aplicaciones instaladas. Incluso si cada uno agrega solo un script de bloqueo de renderizado, son entre 5 y 15 archivos que el navegador debe descargar y ejecutar antes de mostrar cualquier contenido. Cubrimos esto en profundidad en nuestra guía sobre administrar scripts de terceros en Shopify. Y cada vez que instalas una nueva aplicación, puedes deshacer todo tu trabajo de optimización manual.
El enfoque manual frente a Thunder
Esta es exactamente la razón por la que construimos Thunder. Funciona a nivel de tema: intercepta y optimiza cómo se cargan todos los scripts, incluidos los de terceros que no puedes tocar manualmente. Y se adapta automáticamente cuando agregas nuevas aplicaciones o actualizas tu tema. Los planes comienzan en $19.99/mes : significativamente menos que contratar a un desarrollador para que realice el aplazamiento manual de scripts. Si también está considerando un cambio de tema, consulte nuestra guía para temas de Shopify más rápidos Guía : combinar un tema rápido con Thunder te brinda la mejor base posible.
Cómo verificar sus correcciones
Ya sea que hayas usado Thunder o hayas arreglado cosas manualmente, aquí te explicamos cómo confirmar que se eliminaron los recursos que bloquean el procesamiento:
Vuelva a ejecutar PageSpeed Insights
La oportunidad "Eliminar recursos que bloquean el procesamiento" debería mostrar ahorros reducidos o desaparecer por completo. tu Puntuación de rendimiento debería mejorar.
Verificar LCP y TBT
El LCP debería disminuir (el contenido se muestra antes). TBT debería disminuir (menos scripts bloquean el hilo principal).
Probar la funcionalidad de la aplicación
Verifique que los widgets de revisión, las ventanas emergentes, la búsqueda, el carrito y el pago sigan funcionando. Aplazar los scripts puede causar problemas de sincronización: Thunder maneja esto automáticamente, pero los cambios manuales necesitan pruebas exhaustivas.
Monitoreo durante 28 días
Los datos de laboratorio cambian inmediatamente, pero las métricas reales del usuario (datos CrUX en Search Console) tardan 28 días. Siga monitoreando para confirmar que se mantienen las mejoras.
Actualización de junio de 2026: Qué solucionar primero
PageSpeed Insights puede enumerar CSS, JavaScript, fuentes y archivos de terceros, todos bajo la misma advertencia "Eliminar recursos que bloquean el procesamiento". La respuesta útil no es "arreglarlo todo"; es el orden de prioridad correcto.
- Primero arregle el JavaScript de la aplicación si las URL del archivo incluyen aplicaciones de revisión, chat, ventanas emergentes, análisis o creadores de páginas. Estos scripts bloquean la pintura inicial y compiten por el tiempo del hilo principal más adelante.
- Arreglar CSS crítico en segundo lugar si la hoja de estilo de su tema principal aparece cerca de la parte superior de la advertencia. Inserte solo CSS en la mitad superior de la página y cargue el resto de forma asincrónica.
- Arreglar las fuentes en tercer lugar precargando el archivo de fuente principal y usando
visualización de fuente: intercambiar. Las fuentes rara vez superan a los scripts de aplicaciones en términos de ahorro total, pero pueden evitar el texto invisible.
Thunder automatiza los dos primeros pasos para las tiendas Shopify: pospone los scripts de aplicaciones no críticas, conserva el orden de los scripts e integra CSS crítico sin editar el tema manualmente. Para obtener el manual completo, combine este artículo con nuestro Guía de optimización de JavaScript de Shopify y Guía de optimización de CSS de Shopify.
Recursos de bloqueo de renderizado en Shopify: números de 2026
Según datos de más de 2,000 tiendas Shopify analizadas por Thunder en el primer trimestre de 2026, este es el estado actual de los recursos que bloquean el renderizado en la plataforma:
17
Recursos promedio que bloquean el renderizado por tienda (aumento de 14 en 2025 — las aplicaciones siguen creciendo)
2,3s
Retraso promedio causado por recursos que bloquean el procesamiento en dispositivos móviles
68%
De los recursos que bloquean el renderizado provienen de aplicaciones de terceros, no del propio tema
91%
De las tiendas Shopify tienen al menos una advertencia "Eliminar recursos que bloquean el procesamiento" en PageSpeed Insights
La tendencia es clara: a medida que los comerciantes instalan más aplicaciones para competir (la tienda Shopify promedio ahora tiene más de 10 aplicaciones), los recursos de bloqueo de renderizado se siguen multiplicando. Las correcciones manuales funcionan temporalmente, pero las nuevas instalaciones de aplicaciones reintroducen scripts de bloqueo. Una solución automatizada como Optimización continua de Thunder detecta nuevos recursos de bloqueo tan pronto como aparecen.
Para obtener más contexto sobre cómo estos recursos de bloqueo afectan su Core Web Vitals, especialmente LCP e INP, consulte nuestra guía dedicada. Y para ver exactamente cuántos recursos de bloqueo de renderizado La tienda tu tiene, realiza una prueba de velocidad gratuita.
Preguntas frecuentes
¿Qué son los recursos de bloqueo de renderizado en Shopify?
Los recursos que bloquean la renderización son archivos CSS, archivos JavaScript y fuentes que impiden que el navegador muestre el contenido de su página hasta que se hayan descargado y procesado por completo. En Shopify, los recursos que bloquean la renderización más comunes son los scripts de aplicaciones de terceros, el JavaScript del tema, las hojas de estilo CSS externas y las fuentes web. Obligan al visitante a mirar una página en blanco o parcialmente cargada mientras el navegador los procesa.
¿Cómo encuentro recursos que bloquean el renderizado en mi tienda Shopify?
La forma más sencilla es instalar Thunder Page Speed Optimizer: escanea automáticamente tu tienda e identifica cada recurso que bloquea el procesamiento, mostrándote exactamente qué scripts y hojas de estilo están ralentizando tu tienda. Para una verificación manual, ejecute la URL de su tienda a través de Google PageSpeed Insights (pagespeed.web.dev) y busque la oportunidad 'Eliminar recursos que bloquean el procesamiento'.
¿Puedo arreglar los recursos que bloquean el renderizado sin codificar?
Sí. Thunder Page Speed Optimizer corrige automáticamente los recursos que bloquean el procesamiento, sin necesidad de cambios de código. Pospone scripts de terceros, incorpora CSS crítico y optimiza la carga de fuentes con un solo clic. El enfoque manual requiere editar archivos de temas de Liquid, lo que corre el riesgo de dañar su tienda si se hace incorrectamente.
¿Puedo agregar aplazar o async a los scripts de la aplicación Shopify?
No directamente: las aplicaciones mismas inyectan scripts de aplicaciones de terceros y usted no controla sus etiquetas de script. Tendría que ponerse en contacto con cada desarrollador de aplicaciones y pedirles que agreguen aplazar/async, lo que rara vez sucede rápidamente. Thunder resuelve esto interceptando y aplazando automáticamente scripts de terceros sin modificar las aplicaciones.
¿El aplazamiento de scripts dañará mis aplicaciones de Shopify?
Puede hacerlo si se hace manualmente. El aplazamiento ingenuo de scripts (simplemente agregar "aplazar" a todo) puede romper aplicaciones que dependen de la carga de scripts en un orden específico. Thunder maneja esto de manera inteligente: asigna cadenas de dependencia entre scripts y las difiere de manera segura mientras preserva el orden de ejecución, para que sus aplicaciones continúen funcionando correctamente.
¿Cuál es la diferencia entre asíncrono y diferido para scripts?
Ambos descargan scripts en segundo plano sin bloquear el renderizado, pero se ejecutan de manera diferente. 'async' se ejecuta tan pronto como se descarga, independientemente del orden; es arriesgado si los scripts dependen unos de otros. 'diferir' espera hasta que el HTML esté completamente analizado y luego se ejecuta en orden. Para la mayoría de las optimizaciones de Shopify, "aplazar" es más seguro. Thunder elige automáticamente la estrategia adecuada para cada guión.
¿Cuánto más rápida será mi tienda después de arreglar los recursos que bloquean el renderizado?
La mayoría de las tiendas Shopify ven una mejora de 1 a 3 segundos en el tiempo de carga después de corregir los recursos que bloquean el procesamiento. La mejora exacta depende de cuántos recursos de bloqueo tenga y del tamaño de sus archivos. Las tiendas con muchas aplicaciones instaladas suelen obtener las mayores ganancias. Los usuarios de Thunder informan una mejora promedio en PageSpeed de más de 27 puntos.
¿Qué significa "tu página tiene recursos CSS que bloquean"?
Esta advertencia de PageSpeed Insights significa que su página tiene hojas de estilo CSS externas en <head> que el navegador debe descargar y analizar por completo antes de poder representar cualquier contenido visible. Cada archivo CSS externo agrega un retraso de ida y vuelta, generalmente de 50 a 200 ms cada uno. En Shopify, esto incluye la hoja de estilo principal de tu tema, CSS inyectado en la aplicación y Google Fonts. La solución es incorporar CSS crítico (los estilos necesarios para el contenido de la mitad superior de la página) y cargar el resto de forma asincrónica.
¿Cuántos recursos de bloqueo de renderizado tiene una tienda Shopify típica?
Una tienda Shopify típica con 8-12 aplicaciones instaladas tiene 10-25 recursos que bloquean la renderización: 3-5 del tema (JavaScript y CSS), 5-15 de las aplicaciones instaladas (cada aplicación puede añadir 1-3 scripts), y 2-5 de fuentes y servicios externos. Cada recurso de bloqueo añade 50-200ms de retraso. Thunder identifica automáticamente cada recurso que bloquea la renderización en su tienda y le muestra exactamente qué aplicaciones son responsables.
¿Los recursos que bloquean el renderizado afectan la INP (Interacción con la siguiente pintura)?
Sí. El bloqueo de renderizado de JavaScript no sólo retrasa la pintura inicial, sino que también bloquea el hilo principal, retrasando la capacidad del navegador para responder a las interacciones del usuario. Desde que Google reemplazó FID con INP como Core Web Vital en marzo de 2024, esto es aún más importante. Los scripts sincrónicos pesados bloquean el hilo principal durante cientos de milisegundos, lo que hace que los toques y clics se sientan lentos. Aplazar los scripts de bloqueo de renderizado mejora tanto la velocidad de carga inicial como la puntuación INP.
¿El panel de rendimiento integrado de Shopify muestra recursos que bloquean el procesamiento?
El Panel de rendimiento web de Shopify muestra tus Core Web Vitals generales (LCP, INP, CLS), pero no detalla los recursos individuales de bloqueo de renderizado. Para ver exactamente qué archivos están bloqueando el procesamiento, ejecute su tienda a través de Google PageSpeed Insights o use Thunder Page Speed Optimizer, que enumera todos los scripts y hojas de estilo de bloqueo junto con la aplicación que los inyectó.
¿Debo arreglar primero el JavaScript o CSS que bloquea el renderizado en Shopify?
Comience con JavaScript si tiene muchas aplicaciones instaladas, porque los scripts de las aplicaciones suelen crear el mayor retraso y también perjudican el INP. Comience con CSS si PageSpeed Insights muestra grandes ahorros en las hojas de estilo del tema o si su página parpadea en blanco antes de renderizarse. Thunder maneja ambos: aplaza los scripts no críticos e incrusta el CSS crítico para que la primera pintura pueda ocurrir antes.
¿Por qué vuelve a aparecer la advertencia de bloqueo de renderizado después de solucionarlo?
En Shopify, la advertencia suele aparecer después de instalar una nueva aplicación, actualizar un tema, agregar una nueva etiqueta de seguimiento o habilitar un widget que inyecta CSS o JavaScript nuevo. Es por eso que un solo manual corrige el deterioro con el tiempo. Vuelva a realizar la prueba después de cada cambio de aplicación o tema, o utilice la optimización continua para que los nuevos recursos de bloqueo se detecten automáticamente.