6 posts
Three resource hints, three different jobs. Using the wrong one wastes bandwidth and slows the current page. How each one works and when to apply it.
The browser cannot paint until it builds the CSSOM. CSS in an external file means a round trip before the first pixel. Inlining critical CSS removes that.
The correct image for any device depends on viewport width, pixel density, and connection speed. srcset and sizes make that computable at the HTML level.
Google's profiling found 30-50% of bandwidth goes to below-fold images. loading="lazy" defers them, but two cases where it actively hurts LCP.
How image formats, font loading, and third-party tag managers silently destroy LCP and CLS scores, and the exact fixes for each that actually work.
LCP, CLS, INP, and TTFB explained at the technical level. What lab scores miss about real users, how CrUX data differs, and what to fix when metrics look green.