Page is Interactive?

adroit24 · February 12, 2018, 3:50am

I read this definition of Page Is Interactive metric from below:

WPO-Foundation/webpagetest/blob/d137df7a233a2ee941c24334542ddc17248a6e54/docs/Metrics/TimeToInteractive.md

# Time to Interactive (TTI)
TTI is (currently) a Chrome-specific measurement that measures the time until the page being loaded is considered usable and will respond to user input.

## Underlying Measurements
TTI is built on top of a collection of other measurements, some of which are currently only available in Chrome:

### Time to First Meaningful Paint
The measurement is of the first paint after the layout where there was the most change in layout in the visible part of the page.  It is meant to measure the point at which the main content of the page is displayed and is a placeholder until a better method for sites to indicate their main content is available.

Chrome exposes this measurement as a "blink.user_timing" trace event with a name of "firstMeaningfulPaint".  

### Interactive Window
The browser's main thread is considered "interactive" when it is not blocked for more than **50ms** by any single task so it will be able to respond to user input within 50ms.  An interactive window is a period of **at least 5 seconds** where there are no main-thread tasks that take more than 50ms.

### In-flight requests
At any point in time this is the number of outstanding requests.

## TTI Calculation
1. Start looking for TTI at the *first meaningful paint*
2. Look for the first *interactive window* where there is a contiguous period of 5 seconds fully contained within the interactive window with no more than 2 *in-flight requests*

This file has been truncated. show original

Question: I thought this metric would mean I cannot scroll up and down on the page or cannot click on any links on the page (based on the results I have below). But I am still able to do all of that. Then what exactly does having all of the red on Page is Interactive mean?

pmeenan · February 12, 2018, 4:16pm

Scrolling will generally be fine since it is usually handled off-thread for most browsers as long as there are no active scroll events attached. Clicking should be delayed but not necessarily for the full duration of the red (though the first one looks like a single executing JS function so it would be for the full duration of that block).

The red blocks are any point where the main thread is blocked (including from input) for 100ms. A lot of separate 100ms events can make it look like a long block or a single really long event can also show up (which could be a way worse experience).

How did you measure being able to click on a link during one of the red blocks? You’d have to have a test machine handy with a similar CPU and connectivity and then try to click in the UI immediately after it starts to render.

adroit24 · February 14, 2018, 1:59am

I just tried it myself. Loading the page and clicking on links as fast as possible. They seem to click every time. Never seen a lag.

I do see the loading donut on the browser tab for longer, which I assume is because of the longer page load time.

I guess I am trying to figure out how much to worry about this Red block then. Mostly assuming this will impact SEO as Google will see this as well probably?

Kushal.

Topic		Replies	Views
what is the metric called "page is interactive" General Discussion	1	194	October 16, 2019
TTI metric wrong? (main thread looks busy) Support	1	235	January 5, 2019
Page Interactive versus Dom Interactive Discuss Test Results	2	188	September 19, 2018
Time to Interactive and Fully Loaded Support	1	655	February 9, 2022
First Interactive aka First CPU Idle Calculation Support	0	169	February 18, 2020

Page is Interactive?

Related topics