What exactly is First Input Delay?

Authored By: James LePage
Published On: July 8, 2020

Affiliate Disclosure: Some links on this website are affiliate links. We make commissions for purchases made through those links.

We only recommend items/tools that we've personally used and like.

Full Disclosure | FTC Statement

amazon elementor E book

In late May 2020, Google began transitioning towards a more user experience oriented search. In the coming months, the search engine algorithm will begin incorporating user experience (as well as website speed and content quality) when ranking pages.

You may have noticed a new metric called First Input Delay On Google PageSpeed. First Input Delay is a core web vital, and was added to the Google PageSpeed insights tool during the may update. (This is also a Lighthous metric)

In this guide we're going to go over what First Input Delay is, how it may impacts your ranking and page speed scores, what a low FID means, and how to improve it.

What Is First Input Delay?

When you meet somebody, you want to make a good impression. The same goes for your website, when it loads, you want to make a good impression.

To do this, you want to ensure that your website loads as quickly as possible, and becomes usable in the shortest amount of time.

First Input Delay helps measure the initial impression that a visitor gets when browsing your website. It helps measure how long it takes for your website to become responsive to user inputs after loading. Therefore, a good First Input Delay is a short one.

If you're a visitor to a website and you click a button, you expect that button to do what it says it's going to do. Likewise, if you click a link, you expect that link to do what it says is going to do. An example would be the table of contents in this blog post. If you click any link in the table of contents, you probably expected to bring you to that section of this post.

If you click on the link and nothing happens, that's not a good experience. You have a need, you try to resolve the need by using an element on the website, and it doesn't work. Another word for this would be it is unresponsive.

If you try a few seconds later, it works as need be, but the damage is already done your user experience has been impacted negatively.

The time it takes for elements on a webpage to become responsive is called input delay.

First Input Delay measures the span of time from when a user first interacts with your page, (which could be a clickable link, top of a button, or any other user initiated event) to when the web browser is able to process and respond to that respective event.

In simpler terms, with an individual example, FID measures the amount of time it takes for the browser to do something after you click on a link or a button.

First Input Delay scoring

Typically, First Input Delay is measured in milliseconds. You want your First Input Delay to be as low as possible, resulting in the highest perceived responsiveness of the page.

The longer the input delay is, the more unresponsive the pages, and the worse user experience a visitor will have. Google understands this, measures it, and will use it to rank webpages accordingly. Therefore it's not only a good idea to focus on this because you want to make your users happy, but you also want to rank high.

A good First Input Delay scoring is under 100 milliseconds. If it exceeds 100 milliseconds but falls under 300 milliseconds, FID needs improvement. If your FID is anywhere over 300 milliseconds, it is poor, and definitely needs to be addressed.

Input delay is exacerbated by lower powered hardware and slower Internet connections. This means that your input delay could be good on a desktop, but bad on a mobile device.

It also means that if your FID needs improvement on a desktop, it definitely is impacting the mobile user experience as well.

Something interesting about this metric is that it can only be calculated from real-world data. You can't derive first input delight from lab data as you require actual visitors to interact with your web page.

How Do I Improve First Input Delay?

First Input Delay is typically caused by JavaScript and render blocking resources. A good way to improve your First Input Delay would be to reduce the impact of 3rd party code, keep your requests count low, and reduce JavaScript execution time.

You can do this by breaking up long tasks, merging and minifying, deferring unused JavaScript, and using web workers.

If you're using WordPress, we recommend a two pronged approach to improving First Input Delay. First, ensure that you have powerful enough hosting for your website. Shared hosting won't cut it, and if you're on it we recommend migrating to Cloudways (here’s why).

There's also a strong relationship between the time it takes from first contentful paint to time to interactive and 1st input delay.

The time between FCP&TTI is the time that it takes the browser to render the page fully. During that time, if a user makes an interaction with a web page, there will most likely be a delay due to network requests blocking the main thread. If the time between first contentful paint and time to interactive is over a second or so, you'll want to focus on that as well.

Summary

In summary, First Input Delay is the span of time that it takes for a browser to respond to a user interaction. A user interaction is typically a Press of a button, click of a link, or something like that.

The First Input Delay can only be derived from real world data. This makes it very unique. It's also a core web vital, something that will begin impacting the ranking of your website on the Google search in the coming months.

There is a strong correlation between the span of time between First contentful paint, and time to interactive.

Improving your First Input Delay can be done by focusing on JavaScript, using a caching solution, merging, minifying, and deferring noncritical codes, and ensuring that your web hosting is adequate.

Conclusion

This article should have presented what First Input Delay is , why you should worry about it, and how you can improve it. This is a new core web vital, and something that will begin impacting your website ranking in the coming months. Ensuring that your FID is low, and Google is scoring it as “good” is extremely important.

As always, if you have any questions about what First Input Delay is, feel free to leave them in the comment section below.

Join Our Growing Mailing List Of Design Crazed Individuals

Expertly curated emails that will help you generate more income through good design.

You're in the club 💪.

Something went wrong.

Subscribe
Notify of
guest
0 Comments
Inline Feedbacks
View all comments
James LePage is the founder of Isotropic Design, a digital agency that builds WordPress websites. I read, write and design constantly!

Social Share

Crafting Stunning Digital Appearances & Assets Out Of New York.
Get In Touch
Syracuse, NY | Charlotte, NC | New York, NY
© 2020 Isotropic, LLC
linkedin facebook pinterest youtube rss twitter instagram facebook-blank rss-blank linkedin-blank pinterest youtube twitter instagram