Analiza el rendimiento real de tu sitio con datos de CrUX
Cargando historial...
¿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.
¿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.
¿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
deferoasyncen 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.
¿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
widthyheight - Evite los anuncios dinámicos: Reservar un espacio fijo para ubicaciones publicitarias
- Precargar fuentes: uso
font-display: optionalo 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/leftpara el entretenimiento
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.
¿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
¿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.