First Input Delay (FID): The metric Google retired (and why)

What was FID (and why it failed)?

FID measured input delay. The time between a user's first click and when the browser's main thread could start processing it. It didn't measure rendering, visual feedback, or any interaction after the first one.

The fatal flaw: You could have terrible buttons throughout your entire site, but if the first click was fast, you passed. Users experienced sluggish interactions on every form field, every menu click, every button. But FID reported "Good." This made it useless for measuring real responsiveness.

What FID measured

User clicks button at time 0ms
↓
Main thread busy executing JavaScript
↓
Event handler starts at 150ms ← This is FID
↓
Event handler executes (not measured by FID)
↓
Browser paints visual feedback (not measured by FID)

FID only measured the delay, not the full interaction time.

Why Google deprecated FID in favour of INP

FID had fundamental limitations that made it a poor indicator of overall responsiveness. INP addresses all of these issues.

Why FID mattered (historically)

Despite its limitations, FID was the first interactivity metric in Core Web Vitals. It brought attention to JavaScript blocking and main thread performance.

How to measure FID (historical reference)

Field data (Real users)

FID could only be measured with real user data because it required actual user interaction:

• Chrome UX Report - Historical FID data through March 2024
• Google Search Console - Transitioned from FID to INP reporting
• Real User Monitoring - Most RUM tools now track INP instead of FID

Measure FID programmatically (legacy code)

npm install web-vitals

import {onFID} from 'web-vitals';

onFID((metric) => {
  console.log('FID:', metric.value);

  analytics.track('fid', {
    value: metric.value,
    rating: metric.rating
  });
});

// Modern replacement: Use INP
import {onINP} from 'web-vitals';

onINP((metric) => {
  console.log('INP:', metric.value);

  analytics.track('inp', {
    value: metric.value,
    rating: metric.rating,
    interaction_type: metric.entries[0]?.name
  });
});

FID vs INP: Key differences

Example: Same interaction, different scores

Scenario: User clicks button
Timeline:
- 0ms: User clicks
- 80ms: Main thread becomes free (FID = 80ms ✓ Good)
- 80-350ms: Event handler executes (270ms)
- 350-400ms: Browser paints update (50ms)
- 400ms: User sees visual feedback (INP = 400ms ✗ Poor)

FID score: 80ms (Good)
INP score: 400ms (Poor)

FID missed the slow handler and paint time.
INP captured the full user experience.

Migrating from FID to INP

1. Update your monitoring

// Old: Track FID
import {onFID} from 'web-vitals';

onFID((metric) => {
  sendToAnalytics({
    metric_name: 'FID',
    value: metric.value
  });
});

// New: Track INP
import {onINP} from 'web-vitals';

onINP((metric) => {
  sendToAnalytics({
    metric_name: 'INP',
    value: metric.value,
    // INP provides more context
    interaction_type: metric.entries[0]?.name,
    target_element: metric.entries[0]?.target?.tagName
  });
});

2. Adjust your performance budgets

Old FID budgets:
- Good: ≤100ms
- Target P75: 80ms

New INP budgets:
- Good: ≤200ms
- Target P75: 150ms

INP thresholds are higher because it measures more:
- FID: Just input delay
- INP: Input delay + processing + paint

Your optimisation target is harder, but more meaningful.

3. Focus on total interaction latency

Optimisations that improved FID still help INP, but you need to go further:

• FID strategy: Reduce main thread blocking during page load
• INP strategy: Reduce main thread blocking throughout the session + optimise event handlers + minimise DOM work

4. Test beyond initial load

FID testing: Click once during page load
✓ Fast first click
✗ Didn't test scrolling, filtering, form submission

INP testing: Interact throughout the session
✓ Click all buttons
✓ Type in forms
✓ Use filters and search
✓ Navigate menus
✓ Trigger modals

Test the worst interactions, not just the first.

5. Update your dashboards and alerts

• Replace FID charts with INP charts in your analytics
• Update alert thresholds: FID <100ms → INP <200ms
• Track new dimensions: Interaction type, target element, page state
• Historical comparison: Keep FID data for reference but focus on INP trends

FID to INP migration checklist