Post

Did you know if your load you LCP image from another origin (e.g. an image CDN) then LCP time may not be reported properly in RUM (but is in CrUX)? Let’s dig into why, and also how we’re looking to fix this very soon… 🧵

Browsers are VERY careful about cross-origin leaks. They can cause all sorts of security issues. In generally, one origin on the web, should not be allowed to know anything about what’s going on from another origin—even if it’s embedding content from that origin on its own page!

It doesn’t take much to come up with scenarios as to how this could be abused. For example if I include an image from another site that is only available to logged in users, then I can easily figure out whether a user is logged in to that site or not.

So web APIs are often deliberately limited to reduce any risks with this by exposing less data than they get for same-origin resources. One of those things is the LCP presentation time (when the pixels are drawn to screen and so viewable by the user). We didn’t want to expose this unconditionally.

So by default an LCP image from another origin does not give the actual LCP, but instead falls back to the load time of that image (as that info was exposed in other ways anyway). This can be MUCH earlier than the render time. E.g. if you preload the image, or have to run a lot of JS before render.

However, after a lot of work (primarily by @nomster.bsky.social !) we believe this was a somewhat needless restriction for images as the information was fairly trivially exposed in other ways and was causing more problems than it was solving by being restricted.

We’re therefore intending to change this to allow the proper LCP time to be exposed (though coarsened a little to be accurate to within a few milliseconds rather than the exact time). This will mean you can get the (approximate) LCP time even without setting the TAO HTTP header! 🎉

We’re expecting to ship this fairly soon in Chrome (early next year maybe?) and remove one more confusing nuance for LCP! And remove one more difference between CrUX (which didn’t have this restriction) and RUM.