Aprende a mejorar tu PageSpeed y los Core Web Vitals

Técnicas para mejorar el rendimiento del sitio.

Arjen Karel
linkedin

Ayudo a empresas a corregir los Core Web Vitals, configurar un tracking RUM robusto de Core Web Vitals, mejorar la concienciación sobre la velocidad web y gestionar la implementación de buenas prácticas de Core Web Vitals

A veces, cuando tengo algo de tiempo (que no es muy a menudo últimamente), escribo sobre los Core Web Vitals

Hablemos

LCP request discovery en Lighthouse: checks y el fix

La imagen del LCP solo puede empezar a descargarse una vez que el navegador la encuentra. Por qué una foto en una hoja de estilos, un slider o un ajuste de lazy loading retrasa el LCP, y cómo hacer que empiece con el HTML.

Network dependency tree en Lighthouse: cómo leerlo y corregirlo

Los archivos que el navegador solo encuentra dentro de otros archivos hacen que la página espere por cada uno de ellos, uno tras otro. Cómo leer el árbol y las tablas de preconnect, y cómo acortar las cadenas.

Cómo corregir Layout shift culprits en Lighthouse y PageSpeed

Qué se movió mientras cargaba la página, cómo comprobar el elemento que señala Lighthouse y cómo corregir los shifts provocados por imágenes, fuentes, anuncios, barras y CSS tardío.

Use efficient cache lifetimes en Lighthouse: cómo corregirlo

Qué lista el insight de Lighthouse, qué ganan los visitantes recurrentes con un año de caché en los archivos estáticos y dónde configurarlo en tu host, plugin o CDN.

Render-blocking requests: soluciones con o sin desarrollador

Quién añade cada archivo de la lista, qué puedes desactivar sin código y para qué hace falta un desarrollador.

Font display en Lighthouse: qué fuentes corregir y dónde

Una fuente web puede ocultar el texto mientras se descarga y mover la página cuando llega. Qué fuentes de la lista merece la pena corregir y dónde está el ajuste en WordPress, Shopify y en tu propio CSS.

Evita que Coralogix RUM robe tu red inicial

Coralogix RUM envía beacons durante la carga y roba red a tu propio LCP. Almacena los eventos en un buffer y envíalos al ocultar la página.

Solucionar el cambio de diseño del widget de chat de HubSpot

Una solución alternativa que reduce un CLS de 0.91 a 0.02 aprovechando dos exclusiones de cambio de diseño del navegador

Cómo las animaciones disparadas por el scroll provocan CLS

Tu header que se oculta al hacer scroll puede estar fallando en el CLS sin que te des cuenta. Te explico por qué y cómo solucionarlo.

Razonamiento proporcional para el rendimiento web

El cuello de botella es la fase que consume la mayor parte del tiempo total. No la fase que supera un umbral absoluto.

Corrige el INP con un agente de IA: la métrica que las herramientas de laboratorio no pueden medir

El INP no se puede simular. Este es el flujo de trabajo conectado a field data para diagnosticar y corregir Interaction to Next Paint con un agente de IA.

Solucionar el LCP con un agente de IA: de los datos de campo a la corrección del código

El flujo de trabajo completo de diagnóstico del LCP usando CWV Superpowers: desde la identificación de la fase del cuello de botella en los datos de campo hasta el cambio específico en el código.

CWV Superpowers: diagnóstico automatizado de Core Web Vitals

Una skill gratuita para Claude Code que se conecta a los field data de CoreDash y a Chrome para diagnosticar problemas de LCP, INP y CLS y generar fixes en el código.

Agente de IA para monitorizar Core Web Vitals: field data mediante MCP

Tres tipos de servidores MCP conectan a los agentes de IA con datos de Core Web Vitals. Solo uno les da los datos que Google usa de verdad para el ranking.

JPEG XL y Core Web Vitals: lo que necesitas saber ahora que Chrome lo soporta

Cómo se compara JPEG XL con AVIF, WebP y JPEG, qué significa para tus Core Web Vitals y cómo empezar a servirlo hoy mismo

Prerender Until Script: El punto medio entre Prefetch y Prerender

Carga subrecursos y construye el DOM sin ejecutar scripts ni contaminar las analíticas

Aplazar imágenes fuera de pantalla en móvil: guía de lazy loading nativo

Lazy loading nativo, content-visibility y por qué aplazar imágenes con JavaScript es un lastre

Guía de priorización de recursos para Core Web Vitals

Controla qué recursos cargan primero y cuáles esperan.

Cómo programar eventos de dataLayer para optimizar el INP

Cómo posponer los eventos de GTM hasta después del pintado mejora las puntuaciones de INP

Optimiza las Core Web Vitals para dispositivos de gama baja

Por qué los sitios rápidos en hardware económico requieren concesiones más drásticas de las que la mayoría de los equipos admiten

La mejor configuración de Cloudflare para superar los Core Web Vitals

Configura Cloudflare para lograr la máxima velocidad de página y comprende los ajustes con los que cuentas

Eliminar parámetros de seguimiento con Cloudflare Workers y Transform Rules

Los parámetros de seguimiento como fbclid y gclid crean URL únicas que eluden tu caché CDN. Tres formas de solucionarlo.

¡Imágenes hero de Elementor más rápidas en 2 minutos!

Aprende a cambiar de imágenes de fondo lentas a imágenes normales rápidas para las imágenes hero de Elementor en 2 minutos

El impacto de las CSS View Transitions en el rendimiento web

Comprende por qué y cuándo las view transitions pueden afectar al rendimiento web

5 niveles de prioridad de JavaScript y cómo usarlos

No todos los scripts son iguales. Cárgalos en el orden correcto.

Carga responsiva de fuentes web: una estrategia adaptada al dispositivo

Una estrategia de carga de fuentes responsive para un LCP más rápido y cero cambios de layout

Configuración del panel Network de Chrome DevTools para los Core Web Vitals

La configuración del panel Network que uso en cada auditoría de Core Web Vitals

Por qué el retraso de 28 días de los Core Web Vitals es un mito

Los datos de CrUX tienen dos días, no 28. Esto es lo que realmente significa la ventana móvil de 28 días.

Mejora el Interaction to Next Paint eliminando el scrolling con JavaScript

Crea una hermosa experiencia de desplazamiento suave que no afecta los Core Web Vitals

El script GRATIS de último recurso para optimizar la velocidad de la página

Acelera tu página sin arreglo con este método de último recurso para mejorar incluso las páginas más lentas.

Acelera la integración de Calendly

Integra Calendly sin ralentizar los Core Web Vitals

Calentador de caché de sitios web gratuito

Precalienta la caché de tu sitio web para acelerar las Core Web Vitals de forma gratuita

Páginas con Carga Instantánea con Speculation Rules

Aprende cómo mejorar los Core Web Vitals haciendo que las páginas se carguen al instante con la Speculation Rules API

Cómo ceder el hilo principal para mejorar INP

Usa scheduler.yield() para dividir tareas largas y mantener tus páginas responsivas

Core Web Vitals para ecommerce: por qué los visitantes con alta intención de compra tienen el peor rendimiento

Los plugins de caché desactivan la caché para los usuarios con carrito. Así se corrige el abismo del TTFB.

La checklist definitiva de Core Web Vitals (2026)

Todas las optimizaciones que debes revisar al mejorar el rendimiento de LCP, INP y CLS

Layout shift provocado por transiciones CSS

Aprende a encontrar y eliminar las transiciones CSS que provocan layout shifts

Velocidad web con poco presupuesto: las optimizaciones que más importan

Aprende a mejorar los Core Web Vitals con estrategias económicas

Cuándo tiene (y cuándo no) sentido precargar hojas de estilo

Por qué precargar tu CSS normalmente no ayuda, y el único caso donde sí lo hace

Diferir jQuery en WordPress

Aprenda cómo diferir jQuery en WordPress para obtener mayor velocidad de página

Argumentos para limitar los scripts de analítica y rastreo

Cómo afectan los scripts de analítica y rastreo a sus Core Web Vitals y qué hacer al respecto

Las imágenes de fondo son un desastre

Por qué las imágenes de fondo perjudican las Core Web Vitals y cómo sustituirlas

Forced reflow en Lighthouse: qué significa y cómo solucionarlo

Un script que modifica la página y luego pide un tamaño obliga al navegador a rehacer el layout de inmediato. Cuándo congela los toques y cuándo es inofensivo.

Autoalojar Google Fonts para mejorar los Core Web Vitals

Aprende a autoalojar Google Fonts y optimizarlas para mejorar los Core Web Vitals

JavaScript en el Head vs Footer: cómo afecta a los Core Web Vitals

Por qué defer en el head es la mejor práctica moderna, y cuándo la ubicación en el footer todavía tiene sentido

Defer vs Async JavaScript y cómo esto afecta a las Core Web Vitals

Aprende cuándo usar async y cuándo usar defer en JavaScript para obtener los mejores resultados de Core Web Vitals

Diferir scripts hasta que sean necesarios

Carga JavaScript bajo demanda usando IntersectionObserver y disparadores de interacción del usuario

Solucionar 'Reduce Unused JavaScript' en Lighthouse

Encuentra y elimina el JavaScript no utilizado para mejorar tus Core Web Vitals

Lighthouse vs. field data: comprueba que el fix funcionó

Una sola carga simulada frente a 28 días de visitas reales: cómo probar un fix, dónde ver qué experimentaron los visitantes y cuánto tarda Google en verlo.

Widget de chat con Core Web Vitals perfectos

Carga widgets de chat sin perder PageSpeed

¿Deberías usar preconnect para las redes publicitarias? Depende de tu LCP

Usar preconnect para las redes publicitarias puede perjudicar o ayudar. Todo depende de si tu imagen LCP ya está optimizada.

Optimiza las imágenes para las Core Web Vitals

"Aprende cómo las imágenes afectan las Core Web Vitals y cómo optimizarlas

Solucionar el Layout Shift causado por imágenes con tamaño automático

Las imágenes con width auto y height auto causarán un Layout Shift. Aprende cómo solucionar esto

Core Web Vitals Visualizer: Extensión gratuita de Chrome para depurar CWV

Una extensión gratuita de Chrome que crea una superposición en tiempo real de tus Core Web Vitals, creada para desarrolladores que depuran el rendimiento sin abrir DevTools.

Lento por error vs. Lento por diseño: Un framework de rendimiento web

Cómo categorizar los problemas de rendimiento te ayuda a solucionar lo correcto primero

Diferir imágenes de fondo para Core Web Vitals más rápidos

Difiere o aplica lazy load a las imágenes de fondo para un Largest Contentful Paint más rápido

16 métodos para diferir o programar JavaScript

Aprenda cómo diferir y programar JavaScript

Solucionar 'Largest Contentful Paint image was lazily loaded' en Lighthouse

Aprende cómo solucionar la advertencia de Lighthouse 'Largest Contentful Paint image was lazily loaded'

INP en Core Web Vitals: qué es y cómo mejorarlo

Qué mide el INP, en qué se diferencia del FID y cuál de las tres fases corregir primero.

Solucionar scripts de terceros en Next.js para mejorar los Core Web Vitals

Solucione los problemas de Core Web Vitals causados por scripts de terceros en Next.js

Medir Core Web Vitals en Next.js: Guía de configuración RUM

Configurar Real User Monitoring para Core Web Vitals en Next.js (App Router y Pages Router)

Eliminar el CSS que bloquea el renderizado en Next.js para mejorar los Core Web Vitals

Elimina el CSS que bloquea el renderizado en Next.js para unos Core Web Vitals más rápidos

Cloudflare corrigió su script de ofuscación de emails (puede que fuera por mí)

El script de ofuscación de emails de Cloudflare bloqueaba el render. Un Product Manager de Cloudflare leyó este artículo y lanzó el fix. Aun así, conviene evitar los problemas de SEO y seguridad.