Have you ever clicked a page and nothing happens? It’s very frustrating!
While Largest Contentful Paint (LCP) measures how long it takes content to render on a page, First Input Delay (FID) measures how quickly a page reacts to a visitor interacting with it. As one of three Google Core Web Vitals, achieving a reasonable score for this performance metric is critical.
Google considers any FID above 300 milliseconds (ms) to be poor, between 100ms and 300ms needs improvement, and less than 100ms is good.
Measuring FID and Its Alternative
First Input Delay is a field metric which means it can’t be simulated — real user interaction is required to measure response delay. You can use PageSpeed Insights to determine FID if the page has enough data over the previous 28 days. Likewise with Chrome User Experience Report and Google Search Console.
But any changes you make won’t be immediately reflected in your FID score. For that, we need to turn to a different, yet similar, metric called Total Blocking Time (TBT).
Like FID, it also measures unresponsiveness, but without user input. It just adds up the blocking time for all Long Tasks. Those are tasks running on the main thread for over 50 milliseconds.
So, you can make changes and see the effect based on field data. Just remember that field data is a historical report on how a particular URL has performed using a multitude of devices under varying network conditions. Lab data, on the other hand, simulates page load on one device under a fixed set of network conditions.
The #1 Factor Affecting FID
(ctt: Ironic but true! Certain WordPress plugins can help speed up a site whose slowness is caused by other plugins.)
Optimize Your Page for Interaction Readiness
In the above example, third-party scripts block the main thread for 1.46 seconds.
Break up Long Tasks
Additional Ways of Reducing FID
Let’s briefly look at two other ways of improving web performance:
- Minimizing unused polyfills
- Using a web worker
I’ll mention them for the sake of completeness, but they’re really best used by those with some development skills.
A well-optimized site should have a TBT of less than 100ms. Since fixing FID can require the assistance of a developer, the best strategy is to avoid getting into that situation in the first place. If you’re looking for a new WordPress theme, analyze it using any web page tester that provides Total Blocking Time. Likewise,when testing a WordPress plugin, check your TBT before and after installing the plugin.