¿Cómo encontrar el elemento LCP?
Radek ŠírActualizado 19/8/20252 minutos lecturaLa métrica LCP se encuentra entre las más importantes.
Para su optimización, es esencial poder identificar el «elemento LCP», que es el elemento más grande en la parte visible del navegador para un usuario en particular. El tiempo de visualización de este elemento determinará el tiempo de la métrica LCP.
Si deseas optimizar el LCP, es necesario encontrar el elemento LCP en los tipos de páginas más visitadas de tu sitio web.
Puedes identificar los elementos LCP de varias maneras:
1) PageSpeed Insights
Probablemente ya conozcas esta parte de PageSpeed Insights…
… pero para identificar el elemento LCP, busca «Elemento Largest Contentful Paint»:
Consulta PageSpeed Insights.
PageSpeed Insights muestra aquí los resultados de la herramienta Lighthouse, que también impulsa nuestra prueba de velocidad web y está disponible en Chrome DevTools.
Lighthouse es el motor detrás de PageSpeed Insights, está disponible en Chrome DevTools, y también impulsa nuestra prueba de velocidad web.
Consulta Lighthouse.
3) Extensión Web Vitals
Solo necesitas instalar la extensión Web Vitals y revisar la consola en DevTools:
4) Panel de rendimiento en DevTools
Esta es una opción para los más entusiastas:
Una vez encontrado el LCP, el objetivo suele ser renderizarlo lo más rápido posible en la página.
Esto se logra principalmente acelerando los recursos necesarios para su renderizado y, al mismo tiempo, dando la menor prioridad posible a la descarga de todos los demás recursos.
Hablamos de esto en el texto sobre optimización de LCP.