You click on a link and keep waiting for the browser to take you to the next page…
Pretty annoying, isn’t it?
That’s the reason Google introduced First Input Delay (FID) as a part of Core Web Vitals; a metric that helps webmasters address the feeling of clunkiness their users may experience while the page is loading.
Improving FID score will not only enhance user experience but also positively impact other aspects of your site’s performance.
In this blog post, we’ll cover all that and more. But before we get started, let’s understand what First Input Delay is.
What is the First Input Delay?
First Input Delay is one of the Core Web Vital metrics that measures the amount of time it takes for a browser to respond to a user’s first interaction with a page. This interaction could be in the form of clicking a link, tapping on a button, or interacting with other elements on the page.
Some other examples of interaction could be clicking on checkboxes, dropdowns, or downloading a guide.
Basically, First Input Delay measures interactivity; the time a website takes to respond after the visitor interacts. Google uses FID as an important ranking factor. The goal of FID is to calculate how responsive a website is while it’s in loading.
1. FID is not same as ‘Time to Interactive’
Keep in mind that FID is not the same as time to interactive; a performance metric that has been around for a long time. Time to Interactive calculates the total time it takes for a page to become fully interactive.
However, FID tracks user action that happens even before the page is fully interactive. Hence, First Input Delay allows the browser to capture those critical, early interactions.
2. FID measures input Delay, not the event processing time:
FID stands for First Input ‘Delay.’ This means that this metric tells the webmaster about the delay in processing user requests. It doesn’t calculate the whole event processing time because it is easy for developers to get a good FID score by separating the event handler from tasks associated with the event.
3. First Input Delay only measures the first interaction:
FID only calculates first impressions; the first time a user interacts with a web page. Since most of the blocking of browser’s main thread occurs in the initial moment’s of a page loading cycle, all the critical elements must load fast.
FID helps webmasters address delayed initial response and ensures that loading critical resources doesn’t make their site irresponsive or clunky.
4. Continuous actions do not count as interactions:
Keep in mind that continuous types of actions such as scrolling, reading, or zooming in the page does not count as interactions because these actions don’t run on the browser’s main thread, and they often have different constraints.
A website’s FID needs to be less than 100 milliseconds for it to provide a good user experience.
What is the cause of First Input Delay?
Usually, First Input Delay is caused by images, videos, or scripts that load in a non-orderly manner. An unorganized loading causes the web page to load, pause, re-load, and then pause. This results in an unresponsive behavior towards a user’s first interactions.
In Google’s words, the cause of input latency is:
“In general, input delay (a.k.a. input latency) happens because the browser’s main thread is busy doing something else, so it can’t (yet) respond to the user.
Other factors that may result in poor FID score:
- Heavy WordPress themes: Since heavy wordpress themes have complex layouts, more JS files, and inefficient style, they can also impact FID performance.
What is a good FID score?
Core Web Vitals scores can be divided into three categories: Good, Needs Improvement, and Poor.
Good: A website’s FID needs to be less than 100 milliseconds for it to provide a good user experience.
Needs Improvement: The site requires improvement is the FID is between 100 to 300 milliseconds
Poor: If the FID is beyond 300 milliseconds, it is a poor score and needs a lot of improvement.
How to measure the First Input Delay?
Since First Input Delay is a field metric, it can be measures by following tools:
- PageSpeed Insights (Field Data)
- Search Console – Core Web Vitals report.
- Chrome User Experience Report (CrUX)
Webmasters can measure total blocking time and proxy metrics on:
How to reduce First Input Delay?
To improve FID, you should begin by testing your site through above mentioned tools. Webmasters can also run a lighthouse performance audit to find specific opportunities for improvement.
Here are few key steps you can take to improve first input delay score:
Here’s an example of the defer attribute:
<script defer src=”/example-js-script”></script>
Moving forward, we’ll see more and more FID-friendly themes, plugins, and CMS. But until that happens, publishers should take the above-mentioned steps to improve First Input Delay score.