First Input Delay (FID) measures the incremental time between when a user first interacts with a web page, and how long it takes the browser to process that interaction.
FID was selected by Google as one of the key ranking metrics in the Core Web Vitals update that rolled out in 2021; a core algorithm update with a focus on enhancing user experience. While First Input Delay as a ranking factor may seem overwhelming, improvements for FID truly are beneficial for your site and user experience.
In simple terms, optimizing FID makes your pages respond more quickly to user interactions. Have you ever opened a web page and had to wait in limbo to interact with it? Optimizing for FID not only fixes that but can improve your chance of ranking.
Furthermore, improving First Input Delay can increase the likelihood that a user will stay on your site and open up more opportunities to entice them with other content, or move them down the funnel and closer to a conversion.
What is FID?
First Input Delay is a real-user web performance metric, meaning that it cannot be lab tested. It is measured in real-time with real users that are coming to and navigating your page and site. FID is measured in milliseconds and calculates the time that the browser’s main thread is idle—the time between a user interacting with the page and how long it takes the browser to start processing that interaction. This is also commonly referred to as Input Latency.
Interactions that are measured for FID include:
- Inputs for text fields.
- Checkboxes.
- Dropdown selections.
- Links.
Interactions such as zooming and scrolling are not measured and included in the First Input Delay metric.
How Does First Input Delay Work?
The science behind the web vitals update required, included, and considered extensive research. Google likens a user’s page experience to a journey and is focused on removing distractions and potentials for errors.
In real life, as you move from one destination to the next, you are typically unconscious of the mechanics of your movement. However, if you end up with a rock in your shoe, you are going to snap out of the “experience” and focus on the friction you feel from the small hurdle you encountered.
First input delay is focused on eliminating the friction in movement-to-movement interactions with your site. The goal is to make the journey fast and seamless so a user can navigate, explore, and get to their destination without a clunky or negative experience.
In general, users expect near-instantaneous responsiveness, and when input is delayed, it can lead them to errors. A great example is a repeat action, such as double-clicking “add to cart” because the user didn’t think the action initially worked. Now, the user is purchasing two items when they really only wanted one.
This makes for a poor user experience and is an excellent example of why First Input Delay is not only an important metric for ranking with Google, but also why it’s a key factor of the technical health of your site to remain reliable, attractive, and trustworthy to your users.
User Expectations, First Impressions, and FID
Another important consideration used to position FID as a ranking factor and craft it as a metric is that there is no “magic number” that can be used to determine how a user feels after interacting with a site.
Like previously mentioned, FID is a real user performance metric, and real users are actual live humans with different expectations and sensitivities. The baseline for these metrics was created through extensive study in an attempt to find the most valuable threshold that is most likely going to satisfy users across the board.
First Input Delay only measures the input delay after the first input. Essentially measuring the first impression that a user has of interacting with your site. First impressions are a big deal. Additional studies by Google on first impressions of websites found that participants made aesthetic snap judgments for a page within the first 50 ms of exposure.
The science behind the web vitals research for First Input Delay showed that waiting for input delay became perceivable to a user between 70ms and 100ms. When the input delay ranged between 100s to 150ms, users rated the quality significantly lower.
To create a good first impression for input delay, Google recommends keeping FID under 100 ms for 75% of page loads across your site.
FID Page Speed and Other Performance Metrics
After extensively gathering scientific data and research for their Web Vitals update, Google noted meeting the thresholds of the metrics as a whole presented the following impacts:
- Users were 24% less likely to abandon page loads.
- For business and shopping sites that depend on traffic and task completion, there was a:
- 22% decrease in abandonment rate for new sites.
- 24% decrease in abandonment for shopping sites.
These percentages are pretty juicy, showcasing that you can decrease the likelihood of your site being abandoned by nearly a quarter by meeting the Page Speed metrics and performance scores that Google has outlined as part of their ranking factors. Additional ranking factors that align with input delay include First Contentful Paint and Cumulative Layout Shift.
Two additional companion measurements for FID include Total Blocking Time (TBT) and Time to Interactive (TTI).
- Total Blocking Time: TBT also measures the responsiveness—or lack of— of a page. While FID measures the first input with a real user, TBT is measured in the lab and calculates the time between when First Contentful Paint and Time to Interactive—any time the main thread is “blocked” when there is a long task that runs on the thread for more than 50 milliseconds.
In simple terms: the time between when the page loaded the largest element and when the page became responsive and available to interaction.
- Time to Interactive: TTI is a lab metric that measures load responsiveness—how long it takes for a page to become fully interactive and capable of quickly and reliably responding to user input. According to Google, TTI should be less than 5 seconds.
While TTI is invaluable, it falls short of measuring the first input impression of a user like FID does. TTI seeks to measure how long it takes for a page to be fully responsive, whereas FID seeks to measure if the page responded to input when the user interacted with it. From a user experience perspective, it may matter less when the full page is loaded, than responsiveness to direct action—like clicking a product link or trying to navigate with a drop-down selection.
What Causes First Input Delay?
Put simply, the cause of First Input Delay is when a browser’s main thread is too busy to respond to a user. This may happen when a browser is busy running a task trying to execute a large JavaScript file or by images and scripts that are downloading in a non-orderly manner.
Input latency or unresponsiveness occurs because the browser must wait to complete the task before it can respond to user input. Input delay ends when a browser has finished its tasks and can respond to the user. Poor browser performance results in long input delay, unhappy users, and poor FID scores.
How to Measure First Input Delay
First Input Delay measures specific responsive input events: clicks, taps, and key presses, and only calculates the “delay” period in the score. However:
- Not all users who come to your site will interact with a page every time they visit.
- Some users’ first interactions will be at bad times—when the browser is busy.
- Some users’ first interactions will be at good times—when the main thread is idle after completing tasks.
So, touching on the earlier point, not only does every user have their particular preferences and expectations, but users also request input events uniquely. And, building off the fact that FID is an “in the field” measurement-based explicitly on user interactions:
- Some users will not request an event and will have no FID value.
- Some users will request an event immediately and have a high (poor) FID value.
- Some users will request an event after being on the page for a while and will have a low (good) FID value.
So, before measuring, it is important to understand that FID scores can be highly variable, inconsistent, and vary from user to user. The range of variability is unavoidable, but FID can be measured, and still should be.
Google recommends that you measure FID using the following tools:
- Chrome User Experience Report.
- Page Speed Insights.
- Search Console Core Web VItals Report.
- web-vitals JavaScript library.
You can also measure FID in JavaScript using the Event Timing API.
Google also recommends that as you measure, report, and analyze FID data—even though FID under 100 ms for 75% of page loads across your site is the goal— you should take particular care when looking at the 95th-99th percentiles.
This is largely because FID scores can range so greatly due to the uniqueness of each user. Looking at the particularly poor first user experiences shows you the areas that need the most attention and improvement overall.
Max Potential First Input Delay (MPFID)
Additionally, because First Input Delay can vary so significantly, monitoring your pages Max Potential First Input Delay (MPFID) can be helpful to understanding your FID measurements overall. MPFID is the time it takes for the longest task to run on the main thread after FCP.
Measuring MPFID is like measuring the potential worst-case scenario, you are measuring the time of completion for the longest task in the main thread that will force a latency if a user tries to interact with the page. You can also optimize for MPFID by breaking up the largest task into smaller steps and reducing the running time of the longest task overall.
What Is a Good FID Score?
While measuring FID can be complicated, Google’s web.dev has made it simple to see your FID score and if your page meets their ranking metric.
A good FID score will have a delay of 100ms or less.
A needs improvement FID score will have a delay between 100ms and 300ms.
A poor FID score will be any measured delay over 300ms.
How to Improve First Input Delay
Overall, optimizing for First Input Delay means that you need to tidy up some crucial technical aspects of your pages and overall site to reduce input latency. These optimizations are geared towards making your content, scripts, and images more organized, simple, and easy for the browser to download and present without running into large blocks in the main thread. Consider the following:
- CSS Code, Minification, and Compression: CSS can block the main thread. By reducing unnecessary or unused CSS can assist a browser in rendering the page more quickly, as it will have fewer operations to perform. Minification may include removing parts of code such as whitespaces, line breaks, and comments. Compression rewrites the binary code within a file, reducing file size and making the code easier to complete for a browser.
- JavaScript and HTML Attributes: Utilizing HTML attributes like Async and Defer on scripts that are not essential to page rendering can allow you to tell the browser not to block parsing and to break large tasks into smaller ones.This can assist in keeping the main thread running in parallel and in order while JavaScript downloads.
- Third-Party Codes: Third-party scripts can throw a wrench in the ability of your own scripts to execute promptly. Prioritize third-party scripts that are most useful to your users, and consider removing some scripts such as pop-ups and ads that can slow your page down without much user value.
- Web Workers: Web workers are a series of code used to run scripts in background threads and can communicate messages to JavaScript code.
- Minimize Unused Polyfills: While polyfills are important for the ability to modern JavaScript on older browsers, make sure that polyfills do not run unless they are necessary.
- Idle Until Urgent: Idle Until Urgent is a code evaluation strategy developed by Philip Walton, an engineer at Google. The concept overall is that code execution only happens during idle periods, minimizing the main thread blocking time, and improving FID.
Congratulations to you if you made it the entire way through this crash course to define and improve first input delay, and to know when and how to improve browser performance.
If it all sounds technical and complicated, it is, especially if you are not a web developer. Luckily, there are SEO firms like Sure Oak that have a team of technical experts that can do technical auditing and SEO for you and can partner with you to get your FID improvements immediately underway.
