100% Free Forever
AI-Powered Learning
Industry Expert Content
Certificates & Badges
Learn At Your Own Pace

How Do Lighthouse Audits Work and What Do They Measure?

Understand how Lighthouse audits score Performance, Accessibility, and SEO, and how lab data differs from field data.

mediumQ197 of 224 in Web Development Est. time: 5 minsLast updated:
Open Code Lab

Expected Interview Answer

Lighthouse is an automated auditing tool that loads a page in a controlled, throttled environment and scores it across Performance, Accessibility, Best Practices, and SEO categories by running a series of individual audits, each weighted and combined into a 0-100 score per category.

For the Performance category, Lighthouse runs the page under simulated network and CPU throttling (mimicking a mid-tier mobile device on a slow 4G connection) and records key metrics — First Contentful Paint, Largest Contentful Paint, Total Blocking Time, Cumulative Layout Shift, and Speed Index — each weighted differently in the final score (Total Blocking Time and Largest Contentful Paint typically carry the most weight). Because Lighthouse simulates rather than uses a real device by default (lab data), its scores can diverge from real-user Core Web Vitals collected in the field via the Chrome UX Report (CrUX) — lab data is reproducible and good for regression testing, while field data reflects actual user conditions and is what Google’s ranking systems use. Accessibility audits check things like color contrast, ARIA attributes, and alt text using automated DOM inspection, which catches roughly 30-50% of real accessibility issues, so it complements but never replaces manual testing. Lighthouse can run via Chrome DevTools, the CLI, or programmatically in CI to fail a build when scores regress below a threshold.

  • Provides a reproducible, throttled lab environment for catching performance regressions
  • Breaks Performance into weighted, actionable metrics like LCP, TBT, and CLS
  • Surfaces automated Accessibility and SEO issues alongside performance
  • Can be wired into CI to gate deploys on a performance budget

AI Mentor Explanation

A Lighthouse audit is like a fitness test administered to every player under identical controlled conditions — same track, same weather simulation — rather than during an actual live match. The test breaks results into weighted categories: sprint speed counts more than flexibility, similar to Total Blocking Time and LCP carrying more weight than other metrics. Because it is a lab test, a player’s live-match performance under real crowd pressure can differ, just as Lighthouse lab data can diverge from real-user field data. Running that same standardized test before every selection meeting is exactly how teams wire Lighthouse into a CI pipeline.

Step-by-Step Explanation

  1. Step 1

    Load page under throttled conditions

    Lighthouse simulates a mid-tier mobile CPU and slow 4G network to standardize the test environment.

  2. Step 2

    Collect performance traces

    It records timing events during load to compute FCP, LCP, TBT, CLS, and Speed Index.

  3. Step 3

    Weight and score each metric

    Metrics are combined using a weighted formula (TBT and LCP weighted heaviest) into a 0-100 Performance score.

  4. Step 4

    Run parallel category audits

    Accessibility, Best Practices, and SEO audits run independent automated DOM/network checks and produce their own scores.

What Interviewer Expects

  • Understanding that Lighthouse produces lab data under simulated throttling, not real-user data
  • Knowledge of the key weighted metrics: LCP, TBT, CLS, FCP, Speed Index
  • Awareness that lab data (Lighthouse) differs from field data (CrUX/Core Web Vitals)
  • Ability to describe wiring Lighthouse into CI for regression gating

Common Mistakes

  • Treating a single Lighthouse run as ground truth instead of a noisy lab sample
  • Confusing Lighthouse lab scores with real-user Core Web Vitals field data
  • Assuming Accessibility audits catch every accessibility issue automatically
  • Not accounting for run-to-run variance when gating CI on a strict score threshold

Best Answer (HR Friendly)

Lighthouse is a tool that loads your website under simulated slow-network, slow-device conditions and scores it on speed, accessibility, best practices, and SEO. It’s great for catching regressions before you ship, but the numbers are lab estimates — real users on their actual devices might see slightly different results, which is why teams also track real-user data separately.

Code Example

Running Lighthouse programmatically and checking scores
import lighthouse from 'lighthouse'
import * as chromeLauncher from 'chrome-launcher'

async function runAudit(url) {
  const chrome = await chromeLauncher.launch({ chromeFlags: ['--headless'] })
  const options = { logLevel: 'error', output: 'json', port: chrome.port }
  const runnerResult = await lighthouse(url, options)

  const { performance, accessibility } = runnerResult.lhr.categories
  await chrome.kill()

  if (performance.score * 100 < 85) {
    throw new Error(`Performance regression: score ${performance.score * 100}`)
  }

  return { performance: performance.score * 100, accessibility: accessibility.score * 100 }
}

Follow-up Questions

  • How do Lighthouse lab metrics differ from Core Web Vitals field data in CrUX?
  • Why does Total Blocking Time carry more weight than Speed Index in the Performance score?
  • How would you reduce run-to-run variance when running Lighthouse in CI?
  • What percentage of accessibility issues can automated Lighthouse audits actually catch?

MCQ Practice

1. What kind of data does a standard Lighthouse run produce?

Lighthouse runs in a controlled, throttled lab environment, producing reproducible but simulated data.

2. Which two metrics typically carry the most weight in the Lighthouse Performance score?

TBT and LCP are weighted most heavily in the current Lighthouse Performance scoring model.

3. Why can Lighthouse scores differ from real-user Core Web Vitals in CrUX?

Lab data reflects one controlled run; field data aggregates diverse real-user devices and network conditions.

Flash Cards

What environment does Lighthouse test in?A throttled, simulated lab environment mimicking a mid-tier mobile device on slow 4G.

Which metrics dominate the Performance score?Total Blocking Time and Largest Contentful Paint carry the heaviest weight.

Lab data vs field data?Lighthouse produces lab data; CrUX/Core Web Vitals reflect real-user field data.

How can Lighthouse be used in CI?Run programmatically and fail the build if scores drop below a set threshold.

1 / 4

Continue Learning