Analiza el rendimiento real de tu sitio con datos de CrUX

Dominio
URL
Datos actuales
Historia (25 semanas)

Cargando historial...

Elementos vitales web básicos ¿Qué son los Core Web Vitals?

el Elementos vitales web básicos son un conjunto de tres métricas definidas por Google para medir la experiencia del usuario de una página web. Estas métricas son un factor de clasificación oficial para SEO desde 2021.

Para aprobar la evaluación de Core Web Vitals, las tres métricas deben alcanzar el umbral "bueno" en el percentil 75 en datos de campo (datos de usuario reales recopilados por Chrome).

Pintura con contenido más grande (LCP)

Tiempo de carga del elemento visible más grande.

Umbrales: ≤ 2,5 s bueno | > 4s malo

¿Qué es el LCP?

LCP mide el tiempo que lleva mostrar el elemento de contenido visible más grande en la ventana gráfica. Esto suele incluir imágenes destacadas, vídeos o grandes bloques de texto.

Cómo mejorar el LCP

  • Optimizar imágenes: Utilice formatos modernos (WebP, AVIF), comprímalos y establezca dimensiones explícitas
  • Precargar recursos críticos: uso <link rel="preload"> para imágenes y fuentes LCP
  • Mejorar el tiempo de respuesta del servidor: Utilice una CDN, optimice el backend y almacene en caché las respuestas
  • Eliminar el bloqueo de CSS: CSS crítico en línea y aplazar el resto
  • Evite cambios de diseño: Establezca siempre el ancho y el alto de las imágenes

Interacción con la siguiente pintura (INP)

Capacidad de respuesta a las interacciones del usuario.

Umbrales: ≤ 200 ms bueno | > 500 ms malo

¿Qué es el INP?

El INP mide la latencia de todas las interacciones del usuario (clics, pulsaciones, entradas de teclado) durante toda la duración de una visita a la página. Un buen INP significa que la página responde rápidamente a las acciones del usuario.

Cómo mejorar el INP

  • Reducir JavaScript: Divide las tareas largas de JavaScript (>50 ms) en tareas más pequeñas
  • Aplazar JavaScript no crítico: uso defer o async en guiones
  • Evite cálculos pesados: Utilice Web Workers para operaciones costosas
  • Optimice los controladores de eventos: Usar delegación de eventos y rebote/aceleración
  • Minimizar el DOM: DOM más pequeño = actualizaciones de renderizado más rápidas

Cambio de diseño acumulativo (CLS)

Estabilidad visual de la página.

Umbrales: ≤ 0.1 bueno | > 0.25 malo

¿Qué es CLS?

CLS mide la estabilidad visual cuantificando cambios inesperados en el diseño. Un CLS incorrecto frustra a los usuarios que pueden hacer clic en el elemento equivocado debido a un movimiento repentino.

Cómo mejorar CLS

  • Reserva espacio para imágenes/vídeos: Establecer siempre atributos width y height
  • Evite los anuncios dinámicos: Reservar un espacio fijo para ubicaciones publicitarias
  • Precargar fuentes: uso font-display: optional o precargar fuentes críticas
  • Evite insertar contenido encima del contenido existente: Excepto en respuesta a la interacción del usuario.
  • Utilice animaciones de transformación: Prefiero transform à top/left para el entretenimiento
Factores indirectos

Las siguientes métricas no no forma parte de Core Web Vitals y no influyen directamente en la evaluación de Pasa/No pasa. Sin embargo, pueden ser los causa subyacente de un LCP o INP defectuoso. La optimización de estas métricas puede mejorar indirectamente sus Core Web Vitals.

Primera pintura con contenido (FCP)

Primera vista del contenido.

indirecto
Umbrales: ≤ 1,8s bueno | > 3s malo

¿Qué es el FCP?

El FCP mide el tiempo entre el inicio de la navegación y el momento en que el navegador muestra el primer elemento de contenido (texto, imagen, lienzo). Un FCP incorrecto indica que el servidor o el renderizador inicial es demasiado lento, lo que provoca también retrasa el LCP.

Impacto en Core Web Vitals

El FCP es un precursor del LCP: si el primer contenido tarda en mostrarse, el elemento más grande necesariamente también tardará más. Mejorar el FCP generalmente mejora el LCP.

Cómo mejorar el FCP

  • Reducir el TTFB: Un servidor lento retrasa todo lo demás
  • Eliminar recursos de bloqueo: CSS y JS en el <head> renderizado en bloque
  • CSS crítico en línea: El CSS necesario para la primera visualización debe estar en línea.
  • Preconexión a orígenes de terceros: <link rel="preconnect"> para CDN, fuentes, etc.
  • Minimizar CSS/JS: Reducir el tamaño de los archivos a descargar

Tiempo hasta el primer byte (TTFB)

Tiempo de respuesta del servidor

indirecto
Umbrales: ≤ 800 ms bueno | > 1,8s malo

¿Qué es TTFB?

TTFB mide el tiempo entre la solicitud HTTP y la recepción del primer byte de la respuesta. Este es el tiempo que tarda su servidor en "responder". Un TTFB alto retrasar todo lo demás : FCP, LCP e incluso interactividad.

Impacto en Core Web Vitals

TTFB es la base de todas las demás métricas. Si su servidor responde lentamente, todas sus métricas de rendimiento se verán afectadas. A menudo es el Lo primero que hay que optimizar..

Cómo mejorar TTFB

  • Utilice una CDN: Servir contenido desde servidores cercanos a los usuarios.
  • Páginas de caché: Caché del servidor (Redis, Varnish) o caché de aplicaciones
  • Optimice las consultas de la base de datos: Índices, consultas N+1, paginación.
  • Utilice HTTP/2 o HTTP/3: Protocolos más rápidos
  • Evite redirecciones: Cada redireccionamiento agrega un viaje de ida y vuelta a la red.
  • Optimice el backend: Código de servidor eficiente, buen hosting

Llega más lejos con un auditoría completa.

Rastreo, Search Console, Analytics y Logs con solo unos pocos clics.