Web developers require more information on page load performance in the wild. For many page loads, the primary page content is displayed long before the user can actually interact with the page. PerformanceNavigationTiming's interactive attribute will return a DOMHighResTimeStamp with a time value approximating the first time the user can interact with the page and the page's primary content has been displayed on the screen. interactive will be undefined until page load is complete. (TODO - when is page load complete?)
We plan to rely on firstContentfulPaint or DomContentLoaded to determine when the page's primary content has been displayed on the screen. We'll choose between these based on further experimentation.
interactive will be added to the PerformanceNavigationTiming interface in the Navigation Timing API.
window.TODO = () => {
var navigationTiming = performance.getEntriesByType("navigation")[0];
console.log("Time to Interactive: " + navigationTiming.interactive);
}PerformanceNavigationTiming's interactive attribute is computed based on firstContentfulPaint or DomContentLoaded, and the set of time windows during which the page is considered interactive.
We approximate page interactivity based on how busy the thread executing JavaScript is. We consider the page interactive during any time window of length > 10 seconds for which the thread executing JavaScript contains no tasks longer than 50ms. This means that, if input shows up at any time during this time window, it will be a maximum of 50ms before event handlers for this event are executed.
If the page is first displayed during a window of interactivity, interactive = when the page was first displayed. Otherwise, interactive = the start of the first window of interactivity after the page was first displayed.
- Is 50ms a reasonable task length threshold?
- Is 10 seconds a reasonable window length threshold?
- Is
interactivea reasonable name? - Define when page load is complete.