Table of Contents
Overview
First Input Delay (FID) is a real user metric that measures the load responsiveness of a site and quantifies that data to reflect the experiences users have when interacting with unresponsive pages. A low FID indicates that the page is usable. For the ideal customer experience on your site the recommend threshold for First Input Delay is 100 milliseconds or less.
It is important to note that FID can only be collected through real user data. This metric is a reflection of actual human interaction on your site and cannot be measured with synthetic. Total Blocking Time (TBT), however, can be collected via synthetics and also measures the effects of interactivity.
FID Calculation
FID is captured via the Event Timing API in JavaScript. FID is measured by subtracting the processingStart time from the startTime of the first input on the site's page, which is commonly something like a click event. W3C code examples can be found here which is what the Blue Triangle Tag's capturing mechanism is based on. General information about FID and how to measure it can be found here.
Analyzing FID Data
For more information on how to analyze your FID data check out this page from web.dev.
If you are interested in how to optimize your FID check out this article by web.dev here.
Glossary
First Input Delay (FID): measures the time from when a user first interacts with a page (i.e. when they click a link, tap on a button, or use a custom, JavaScript-powered control) to the time when the browser is actually able to begin processing event handlers in response to that interaction.
processingStart: The processingStart
attribute’s getter returns a timestamp captured at the beginning of the event dispatch algorithm. This is when event handlers are about to be executed.
startTime: This attribute MUST return the time value of the first recorded timestamp of this performance metric. If the startTime concept doesn't apply, a performance metric may choose to return a startTime
of 0
.
Sources
https://w3c.github.io/event-timing/
https://web.dev/fid/#measure-fid-in-javascript
https://w3c.github.io/event-timing/#sec-example
Comments
0 comments
Please sign in to leave a comment.