└── README.md /README.md: -------------------------------------------------------------------------------- 1 | # PerformanceNavigationTiming interactive 2 | 3 | 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?) 4 | 5 | We plan to rely on [`firstContentfulPaint`](https://github.com/tdresser/time-to-first-meaningful-paint/blob/master/README.md) or [DomContentLoaded](https://html.spec.whatwg.org/multipage/indices.html#event-domcontentloaded) to determine when the page's primary content has been displayed on the screen. We'll choose between these based on further experimentation. 6 | 7 | ## Using `interactive` 8 | `interactive` will be added to the [PerformanceNavigationTiming](https://www.w3.org/TR/navigation-timing-2/#sec-PerformanceNavigationTiming) interface in the [Navigation Timing API](https://www.w3.org/TR/navigation-timing-2/). 9 | 10 | ```javascript 11 | window.TODO = () => { 12 | var navigationTiming = performance.getEntriesByType("navigation")[0]; 13 | console.log("Time to Interactive: " + navigationTiming.interactive); 14 | } 15 | ``` 16 | 17 | ## Computation 18 | PerformanceNavigationTiming's `interactive` attribute is computed based on [`firstContentfulPaint`](https://github.com/tdresser/time-to-first-meaningful-paint/blob/master/README.md) or [DomContentLoaded](https://html.spec.whatwg.org/multipage/indices.html#event-domcontentloaded), and the set of time windows during which the page is considered interactive. 19 | 20 | ### Interactivity 21 | 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. 22 | 23 | ### Combining interactivity and when the page is first displayed 24 | 25 | 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. 26 | 27 | ## TODO 28 | * Is 50ms a reasonable task length threshold? 29 | * Is 10 seconds a reasonable window length threshold? 30 | * Is `interactive` a reasonable name? 31 | * Define when page load is complete. 32 | --------------------------------------------------------------------------------