Solución rápida con Thunder
Thunder Page Speed Optimizer está diseñado para el momento exacto en el que una aplicación útil de Shopify perjudica la velocidad de la tienda. Mantiene la pila de aplicaciones en su lugar mientras mejora la carga de scripts, la prioridad de recursos, las imágenes, las fuentes y los patrones móviles de Core Web Vitals.
Por qué la puntuación de velocidad de Shopify cae después de instalar aplicaciones
Las aplicaciones de Shopify pueden agregar código de escaparate de varias maneras: incrustaciones de aplicaciones, extensiones de aplicaciones temáticas, etiquetas de script, eventos de clientes, píxeles, archivos CSS, fragmentos, iframes y llamadas API de terceros. Algunas aplicaciones agregan código solo en las páginas de productos. Otros se cargan en cada página incluso cuando el widget visible aparece solo en un lugar.
Ese código adicional puede afectar los tres Core Web Vitals. Un widget de reseñas puede retrasar la pintura con contenido más grande si bloquea la plantilla del producto. Un script de seguimiento puede perjudicar la interacción con Next Paint al agregar largas tareas de JavaScript. Una ventana emergente o una barra de anuncios puede crear un cambio de diseño acumulativo cuando aparece después de que la página ya ha comenzado a renderizarse. Google recomienda LCP por debajo de 2,5 segundos, INP por debajo de 200 milisegundos y CLS por debajo de 0,1 para una buena experiencia de usuario.
El Panel de rendimiento web de Shopify es útil porque muestra el rendimiento real del usuario y puede ayudarte a conectar una regresión de velocidad a cambios como instalaciones de aplicaciones, publicaciones de temas y ediciones de código. Use esa línea de tiempo primero, luego use Puntuación de velocidad de Shopify frente a PageSpeed Insights para entender por qué diferentes herramientas pueden mostrar números diferentes.
Paso 1: Confirme que la aplicación realmente causó la caída
Las puntuaciones de velocidad cambian por motivos que no tienen nada que ver con la aplicación que acabas de instalar. El tráfico puede desplazarse a países más lentos, un cambio de tema puede publicarse al mismo tiempo, la página de inicio de una campaña puede recibir más visitantes móviles o los datos de campo de Google pueden actualizarse después de un retraso.
- Anota la fecha de instalación. Compáralo con el panel de Shopify y las notas analíticas.
- Pruebe cuatro URL. Utilice la página de inicio, una página de producto, una página de colección y una página de destino.
- Comparar los tipos de páginas afectadas. No se debe culpar a una aplicación de reseñas de productos por una caída de LCP solo en la página de inicio a menos que también se cargue allí.
- Verifique el panel de red del navegador. Busque nuevos JavaScript, CSS, archivos de fuentes, solicitudes de iframe y llamadas de análisis.
- Duplica el tema antes de cambiar nada. Nunca depures una ruta de ingresos directamente en el tema en vivo.
Si la puntuación bajó pero las métricas de usuario reales aún no han cambiado, lea por qué las correcciones de puntuación de velocidad de Shopify no aparecen. El mismo retraso en los datos de campo puede hacer que las regresiones y recuperaciones parezcan tardías.
Auditoría manual de impacto de aplicaciones para caídas de puntuación de velocidad de Shopify
La ruta manual es sencilla pero lenta: aísle la aplicación, decida si vale la pena conservarla y luego haga que el navegador la cargue más tarde o solo cuando sea necesario. Esto es más fácil con un tema duplicado y una hoja de cálculo de resultados de antes y después.
| Señal | Lo que suele significar | Primera solución |
|---|---|---|
| Nuevas tareas largas de JavaScript | El código de widget, píxel, reseñas, chat o carrito está bloqueando el hilo principal. | Aplazar scripts no críticos y cargar widgets según la intención del usuario. |
| Más CSS que bloquea el renderizado | La aplicación agregó una hoja de estilo que bloquea el primer renderizado. | Cargue CSS de la aplicación solo en las páginas donde aparece la aplicación. |
| El diseño cambia después de la carga | La aplicación inyecta un banner, una ventana emergente, estrellas, recomendaciones o un mensaje de pago tarde. | Reserve espacio con CSS o retrase la interfaz de usuario no crítica hasta después de la primera interacción. |
| Saltos de carga útil de la red | La aplicación carga imágenes, fuentes, respuestas API o bibliotecas empaquetadas. | Limite la ubicación de la página, reduzca las opciones de widgets o reemplace la aplicación. |
Para categorías de aplicaciones más detalladas, consulte nuestras guías en arreglar scripts de aplicaciones que ralentizan Shopify, JavaScript de terceros que bloquea Shopify, y Aplicaciones de Shopify que ralentizan tu tienda.
Correcciones de temas que reducen el daño a la velocidad de la aplicación
Se puede reducir cierto impacto de la aplicación en el código del tema. Haga esto con cuidado porque los scripts de aplicaciones a menudo controlan funciones visibles, análisis, opciones de productos, carritos, suscripciones, reseñas o herramientas de cumplimiento.
First, remove app blocks from templates where they do not matter. A product recommendations app may not need to run on every blog post. A review widget should not load on collection pages if no review UI appears there. A chat app may be delayed until after the first scroll or click.
En segundo lugar, reserve espacio de diseño para la interfaz de usuario de la aplicación que se carga tarde. Por ejemplo, si aparecen estrellas de reseña o un mensaje de pago debajo del título del producto, asigne al contenedor una altura mínima estable:
.product-review-slot {
min-height: 28px;
}
.installment-message-slot {
min-height: 40px;
}En tercer lugar, evite cargar widgets opcionales antes del contenido principal del producto. Un simple cargador retrasado puede ayudar con los widgets que no son necesarios para la primera pintura:
<script>
window.addEventListener('load', function () {
window.setTimeout(function () {
var script = document.createElement('script');
script.src = 'https://example-app-cdn.com/widget.js';
script.async = true;
document.body.appendChild(script);
}, 2500);
});
</script>No utilice ese patrón para los scripts necesarios para la selección de variantes, agregar al carrito, suscripciones, enlaces de pago, prevención de fraude, consentimiento o análisis esenciales. Pruebe el flujo de compras en el móvil antes de publicar cualquier cambio.
Solución manual frente a solución Thunder
| Problema después de instalar la aplicación | Corrección manual | Solución de trueno |
|---|---|---|
| Los scripts de aplicaciones dañan INP o TBT | Inspeccione cada script, decida qué se puede aplazar y controle los widgets manualmente. | Optimiza la carga de scripts con reglas de seguridad centradas en Shopify. |
| Representación de bloques CSS de aplicaciones | Mueva CSS a las plantillas necesarias, incorpore estilos críticos y evite estilos de aplicaciones duplicados. | Mejora la carga de recursos como parte de la pila de rendimiento automatizada. |
| Diseño de cambios de interfaz de usuario inyectado | Reserve espacio para bloques de aplicaciones, reseñas, ventanas emergentes y pancartas. | Reduce los problemas comunes de Core Web Vitals y ayuda a estabilizar el comportamiento de carga. |
| La gran cantidad de aplicaciones ralentiza el móvil | Elimina aplicaciones de bajo valor, consolida herramientas y reescribe widgets de alto impacto. | Automatiza el primer pase de velocidad antes de una costosa limpieza personalizada. |
Cuándo conservar, reemplazar o eliminar la aplicación
Un puntaje de velocidad no es el negocio. Si una aplicación aumenta un 8 por ciento los ingresos y cuesta 4 puntos de velocidad, probablemente la conserve y optimice la carga. Si una aplicación agrega una insignia en la que nadie hace clic y cuesta 20 puntos móviles, elimínela.
Utilice una regla de decisión simple: mantenga las aplicaciones que protegen claramente los ingresos o el cumplimiento, reemplace las aplicaciones que duplican otra herramienta y elimine las aplicaciones que agregan código de escaparate sin valor medible. Entonces usa nuestra guía completa de optimización de velocidad de Shopify para solucionar los problemas restantes con el tema, los medios y el guión.
Si desea una ruta más rápida, instale Thunder, ejecute las mismas URL de prueba nuevamente y compare el resultado. Para las tiendas que deciden entre una aplicación y el trabajo de un experto, consulte Herramienta de optimización de velocidad de Shopify: aplicación, auditoría o desarrollador o marcar Precios de trueno.
FAQ
¿Por qué bajó mi puntuación de velocidad de Shopify después de instalar una aplicación?
La mayoría de las caídas se producen porque la aplicación agregó JavaScript, CSS, píxeles, widgets, solicitudes de red o cambios de diseño en el escaparate. La aplicación puede ser útil, pero el navegador ahora tiene más trabajo antes de que la página pueda cargarse y responder.
¿Debo desinstalar la aplicación si mi puntaje de velocidad de Shopify bajó?
No inmediatamente. Primero pruebe la página antes y después de deshabilitar la inserción de la aplicación, verifique si la aplicación afecta los ingresos y vea si el aplazamiento del script o los cambios en la carga resuelven el problema. Elimínelo solo cuando la aplicación no justifique su costo de velocidad.
¿Puede Thunder solucionar las caídas de velocidad causadas por las aplicaciones de Shopify?
Thunder can help when the drop comes from common app-related performance issues such as script loading, render-blocking resources, lazy loading conflicts, heavy images, fonts, and mobile Core Web Vitals bottlenecks.
¿Cómo puedo saber qué aplicación de Shopify ralentizó mi tienda?
Compare la fecha de instalación con los cambios del Shopify Web Performance Dashboard, ejecute una prueba de velocidad en plantillas clave, inspeccione solicitudes de terceros en DevTools y luego deshabilite la inserción de una aplicación a la vez en un tema duplicado.
¿Las aplicaciones integradas ralentizan Shopify incluso cuando están apagadas?
Por lo general, la inserción de una aplicación no debería cargar el código del escaparate cuando está deshabilitada, pero los fragmentos antiguos, las ediciones de temas, los píxeles y los recursos sobrantes pueden permanecer después de los cambios en la aplicación. Verifique los archivos de temas y los eventos de los clientes antes de asumir que la aplicación ya no existe.
¿Cuánto tiempo tarda en recuperarse la puntuación de velocidad de Shopify?
Las pruebas de laboratorio pueden mejorar inmediatamente después de una corrección. El Panel de rendimiento web de Shopify y los datos de campo de Google tardan más porque utilizan datos reales de visitantes a lo largo del tiempo, así que juzgue las tendencias en días o semanas.
Conclusión
Si tu puntuación de velocidad de Shopify cae después de instalar aplicaciones, no entres en pánico y no las elimines a ciegas. Compare las plantillas afectadas, aísle el impacto de la aplicación, conserve las herramientas que generan su costo de carga y use Thunder para automatizar las correcciones comunes de secuencias de comandos, imágenes, fuentes, carga diferida y Core Web Vitals antes de pagar por el trabajo personalizado.