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.

The other origin can “opt-in” to allow your site to give the actual render time if they believe it’s safe by setting the Timing-Allow-Origin HTTP Header, and many image CDNs do this. But if you have your own assets domain for serving images then maybe it doesn’t? If so, look into setting that!

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! 🎉