While users typically spend time above the fold, there may be times when they want to scan an entire page - e.g. news, product info. Once the content ATF is visible the user may explore elements down the page, often times waiting.
Also a new trend in design also is shaping page performance with the advent of tiered hero images - e.g. 5 hero images on a single page. So, it would be interesting in determining at what point did the other elements render.
If they aren’t visible on the page (and for some extension of the viewport in all directions) the browser may not render it at all (at least Chrome doesn’t).
You can see at what point the different hero images themselves finished loading and that will be reasonably close (as long as it is after the main hero image is actually drawn). You can even code it up as a custom metric that runs after the page loads to extract the timings:
- Walk the DOM getting the hero image URLs for the elements you care about
- Pull the resource timing information from window.performance
- Get the end load time for each of the images you care about