Priority hints, una mirada honesta al lazy loading, y por qué el CDN no era el cuello de botella.
El cliente ya había comprado un CDN, activado el lazy loading en todas partes y comprimido cada recurso. El LCP en móvil seguía en 5,4 s. Ninguna de esas tres cosas estaba mal; simplemente apuntaban a la imagen equivocada.
Poner lazy loading en el hero es dispararse en el pie
loading="lazy" en el elemento más grande por encima del pliegue retrasa exactamente lo que
mide el LCP. La mitad de las webs que auditamos hacen esto, normalmente porque un plugin aplicó
el atributo a toda la web. El arreglo es de una línea: la imagen del hero carga de inmediato y
lleva fetchpriority="high", todo lo que queda por debajo del pliegue sigue con lazy loading.
El cuello de botella era la fuente
Con la imagen resuelta, el LCP pasó al titular — que esperaba una fuente web, que esperaba una
hoja de estilos, que esperaba un script de terceros. Preconectar con el host de la fuente y
fijar display: swap quitó otros 900 ms.
La cifra final fue 2,1 s, y el CDN nunca fue el problema. Mida el elemento LCP real antes de optimizar nada; las herramientas le dicen cuál es.