Which element is the last painted hero?

I’m trying to work out when the Last Painted Hero hero image was loaded. I’d like to get the number in the load order (‘number’) and the time (‘all_start’ etc.). I can’t find the number in any of the LastPaintedHero fields. I tried using the largest image as a proxy, but I found a couple of cases where the largest image loads after the LastPaintedHero. I’ve tried the Github page and searching this forum, but I can’t find a way forward.

Is there a way of identifying which element(s) are the LastPaintedHero?

I’ve found out some more detail. There are different categories of hero:

  • Image
  • Background image
  • Heading
  • Custom hero

The last painted hero is the last of these heroes to render on the browser screen.

The hero image is usually the largest image on the page, but you might have to define a larger viewport to make sure the system correctly identifies the hero image. WebPageTest identifies images by their x and y specification only. To find which image is the hero image, you have to match the x and y data - something that’s not straightforward.

However, if you only want to find out what category the last painted hero is, all you have to do is look at the category hero timings.