Gesamte Blockierungszeit (TBT)

TL;DR — Total Blocking Time (TBT) measures wie long Ihre Seite ist frozen — unable zu respond zu ein klicken oder tap — während es loads. ein lab Tool like Lighthouse adds up alle the time the main thread ist blocked zwischen the erste paint und wenn the Seite wird interactive. Under 200 ms ist good. es ist ein lab-nur number, es ist nicht ein Core Web Vital, und es wird nicht zeigen up in Search Console.

war TBT ist

wenn ein Seite loads, the browser hat one main thread doing the heavy lifting — running JavaScript, building the Seite, reacting zu Ihre clicks. es kann nur tun one thing bei ein time. wenn ein chunk von JavaScript hogs that thread für too long, the Seite goes momentarily unresponsive: Sie tap ein button und nothing happens until the script finishes.

Total Blocking Time ist ein measurement von exactly that frozen time during load. ein testing Tool like Lighthouse loads Ihre Seite in ein controlled environment, watches the main thread, und adds up alle the time es war blocked aus responding zu input.

The 50ms rule

nicht every bit von arbeiten counts. The browser kann handle short tasks ohne Sie noticing. The line ist 50 milliseconds: any task that läuft longer than that ist ein “long task,” und nur the part above 50 ms counts als blocking time.

So ein task that läuft für 70 ms adds 20 ms zu Ihre TBT. ein task that läuft für 40 ms adds nothing. TBT ist the sum von alle diese “above 50 ms” slivers während the Seite ist loading.

war ist ein good score?

in Lighthouse, auf mobile:

• Good: 200 ms oder weniger
• benötigt improvement: bis zu 600 ms
• Poor: over 600 ms

The thing meisten Menschen erhalten wrong

TBT ist nicht ein Core Web Vital. The three Core Web Vitals sind LCP, INP, und CLS. TBT ist ein lab Tool that hilft predict Ihre Interaction to Next Paint (INP) — the real-user metric Google tatsächlich uses. Sie wird nicht finden TBT in Google Search Console oder in field data, weil es ist measured durch simulating ein Seite load, nicht durch watching real visitors.

wollen the full mechanics — the worked Beispiel, warum TBT carries the meisten weight in Lighthouse, the TBT-vs-INP difference, und wie zu tatsächlich fix es? Switch zu the Fortgeschritten tab.

TL;DR — TBT ist the total amount von time, zwischen erste Contentful Paint und Time zu Interactive, that the main thread war blocked long genug zu verhindern input responsiveness. es sums the blocking portion (duration − 50 ms) von every long task (any main-thread task over 50 ms). es ist ein lab metric — the single largest weight (30%) in the Lighthouse 10 score und the lab proxy für INP — aber es ist nicht ein Core Web Vital und never erscheint in CrUX oder Search Console. Mobile thresholds: good ≤200 ms, poor >600 ms. Fix es like Sie’d fix INP: break up long JS tasks, code-split, defer/remove unused JS, tame Drittanbieter- scripts. My honest nehmen: fix es für users, nicht für ein Ranking bump.

war TBT tatsächlich measures

Google’s definition ist the place zu beginnen. TBT ist “the total amount von time after erste Contentful Paint (FCP) wo the main thread war blocked für long genug zu verhindern input responsiveness.” The browser’s main thread processes one task bei ein time; während es ist busy mit ein long chunk von arbeiten, es kann nicht react zu ein klicken, ein tap, oder ein keypress. TBT quantifies wie much von Ihre Seite-load window ist spent in that blocked state.

Two definitions tun alle the arbeiten hier:

• ein long task ist “ein task that läuft auf the main thread für mehr als 50 milliseconds.”
• The blocking portion von ein task ist its duration minus 50 ms. Tasks bei oder under 50 ms contribute exactly 0 ms.

TBT ist the sum von diese blocking portions zwischen FCP und Time zu Interactive (TTI). So First Contentful Paint ist the beginnen line: nothing vor the erste paint counts, weil es gibt nothing auf screen zu interact mit yet.

The worked Beispiel

Google’s own table ist the clearest illustration. Imagine five tasks ausführen auf the main thread zwischen FCP und TTI:

Tasks three und four sind under the 50 ms line, so they contribute nothing. Task one blocks für 250 − 50 = 200 ms, task five für 155 − 50 = 105 ms. hinzufügen the blocking portions — 200 + 40 + 0 + 0 + 105 — und Sie erhalten 345 ms von TBT. das ist ein “benötigt improvement” score, driven almost entirely durch two heavy tasks.

dies ist the counter-intuitive part worth internalizing: “ein small number von tasks auf the main thread tut nicht necessarily bedeuten low blocking time. Conversely, ein large number von tasks tut nicht necessarily lead zu tons von blocking time.” (That framing ist NitroPack’s, relayed hier — reverified against the live Quelle 2026-07-18.) war zählt ist whether individual tasks cross 50 ms, nicht wie viele tasks dort sind.

The measurement window: FCP zu TTI

The window ends bei Time zu Interactive — “the time aus wenn the Seite starts loading zu wenn its main sub-resources haben loaded und es ist capable von reliably responding zu user input quickly.” in Lighthouse, TTI ist gefunden durch searching forward für ein five-second “quiet window” mit kein long tasks und kein mehr als two in-flight network Anfragen.

Worth noting: TTI itself war entfernt aus Lighthouse 10 weil es proved overly sensitive zu outlier network Anfragen und long tasks, producing high variability. TBT survived und became the primary interactivity metric. als Philip Walton put es, “Newer, alternative, metrics like Largest Contentful Paint (LCP), Total Blocking Time (TBT), und Interaction zu nächste Paint (INP) sind usually better metrics zu verwenden in place von TTI.” TBT didn’t ersetzen TTI als the window’s endpoint — es ist ein better single number für the gleich underlying problem. und TTI’s disappearance aus the Lighthouse Bericht UI ist nicht the gleich claim als TTI kein longer bounding Lighthouse’s Standard navigation window — the window itself ist still measured that Weg under the hood.

One mehr scoping note: “FCP zu TTI” describes Lighthouse’s Standard navigation audit specifically. Other Tools, oder Lighthouse itself running ein timespan trace statt ein full Seite-load navigation, kann total ein different measured window — the 50 ms long-task math tut nicht ändern, aber the beginnen und end points von war erhält summed sind Tool- und trace-mode-specific, nicht ein universal law von the metric.

ist TBT ein Core Web Vital? kein.

dies ist the meisten common misconception, so let’s sein blunt über es. The three Core Web Vitals sind LCP, INP, und CLS. TBT ist nicht one von them. Google’s own wording: “Total Blocking Time (TBT) ist ein lab metrics ist vital in catching und diagnosing potential interactivity issues that kann impact INP. However, es ist nicht part von the Core Web Vitals festlegen weil they sind nicht field-measurable, nor tun they reflect ein user-centric outcome.” (The grammar in that sentence ist theirs, nicht mine.)

So wo tut TBT zeigen up, und wo tut nicht es?

• wo Sie sehen es: Lighthouse, PageSpeed Insights’ lab tab, und Chrome DevTools — alle simulated/lab environments.
• wo Sie don’t: Google Search Console’s Core Web Vitals report, CrUX, oder any field data. diese nur carry LCP, INP, und CLS.

wenn someone tells Sie sie sind “watching TBT in Search Console,” sie sind mistaken — GSC Berichte field data, und TBT ist nicht ein field metric.

One correction worth being precise über: TBT being lab-recommended ist nicht the gleich als TBT being field-impossible. Sie kann technically compute ein TBT-style total in the field mit the Long Tasks API — Google says so directly: “es ist possible zu messen TBT in the field, aber wir don’t empfehlen dies als user interaction kann affect Ihre Seite’s TBT in ways that lead zu lots von variance in Ihre Berichte.” das ist ein Empfehlung against es, nicht ein technical wall. war ist tatsächlich true ohne exception ist narrower: CrUX und Search Console’s Core Web Vitals report never carry TBT, full stop — diese pipelines nur ever collect LCP, INP, und CLS.

TBT ist the lab proxy für INP

hier’s warum TBT exists bei alle. Lab Tools load ein Seite in ein simulated environment mit kein real user, so they kann nicht messen Interaction to Next Paint — INP benötigt actual clicks und taps. TBT fills that gap: “the Total Blocking Time (TBT) metric ist lab-measurable und ist ein proxy für INP.”

The two sind mechanically related: “Although INP und TBT sind calculated differently, they sind both reflections von ein blocked main thread during the bootstrap process. wenn the main thread ist blocked, the browser ist delayed in responding zu user interactions.” und empirically, “ein low TBT häufig correlates mit ein low Interaction zu nächste Paint (INP).”

aber “proxy” ist nicht “substitute.” Google ist explicit: “Total Blocking Time (TBT) may sein ein reasonable proxy metric für INP, aber es ist nicht ein substitute für INP in und von itself.” They diverge in real ways:

• High TBT, fine INP. TBT measures blocking during load. wenn Ihre users don’t tatsächlich try zu interact during that blocked window — they wait für the Seite zu look finished erste — their INP kann sein fine even mit ein ugly TBT.
• Fine TBT, poor INP. INP auch deckt ab slow event handlers und rendering arbeiten that fire after load, plus things like the browser’s 300 ms tap delay auf non-mobile-optimized Seiten — none von welche TBT sees.

wenn the lab und field disagree, trust the field. INP (the real-user number) takes priority over TBT (the lab estimate).

One historical note that trips Menschen up: TBT verwendet zu sein the lab proxy für erste Input Delay (FID). INP replaced FID als ein Core Web Vital auf March 12, 2024, so TBT ist now INP’s proxy. The underlying mechanism never changed — es ist immer been über ein blocked main thread during load — aber any older article calling TBT “FID’s proxy” predates that switch.

warum TBT dominates the Lighthouse score

TBT carries the largest single weight in the Lighthouse Performance score — 30%, ein weighting introduced in Lighthouse 10 und, verified live against Chrome’s scoring docs auf 2026-07-18, still unchanged durch the current Lighthouse 13:

Treat that table als version-und-date-scoped, nicht ein permanent constant — Lighthouse hat changed its weights vor und kann again. Re-überprüfen against Lighthouse performance scoring vor quoting es in ein audit deck.

dies ist the practical Grund TBT matters für SEO audits even though es ist nicht ein Ranking signal: ein poor TBT hat ein outsized effect auf that big Lighthouse number everyone screenshots. Addy Osmani’s worked Beispiel macht es concrete — removing one Intersection Observer polyfill cut TBT aus 400 ms zu 300 ms und lifted the Lighthouse Performance score aus 63 zu 70. One fix, seven points, weil von the 30% weight.

One mehr nuance: the “Good ≤200 ms” category threshold und the Lighthouse score sind different scales. zu score 90+ auf the TBT subscore Sie benötigen roughly ≤300 ms auf mobile, und zu hit 100 Sie benötigen ≤100 ms. (diese subscore figures sind DebugBear’s documentation von the scoring curve, reverified against the live Quelle 2026-07-18.) “Good” und “100” sind nicht the gleich bar.

tut TBT affect SEO Rankings?

nicht directly — und I’ll sein straighter über dies than meisten.

TBT ist nicht ein Ranking signal. Google’s interactivity Ranking input ist INP, ein field metric. TBT ist ein diagnostic that hilft Sie finden und fix the long tasks that hurt INP. Improving TBT may verbessern INP, welche might marginally helfen the Seite Experience side von Rankings — aber das ist two Links von “may” away aus Ihre positions.

und hier’s my actual position auf the whole Core Web Vitals question, welche I’ve written before in my page speed guide: I don’t think Core Web Vitals haben much impact auf SEO, und unless Sie sind extremely slow I generally wird nicht prioritize them. tun them für users und conversions, nicht für ein Ranking bump. That applies doubly zu TBT, welche ist ein lab proxy für ein field metric für ein small Ranking input. Fix es weil ein frozen Seite loses Sie Kunden — nicht weil Sie sind chasing ein position.

war causes high TBT

es ist almost immer JavaScript:

• Unnecessary JavaScript loading, parsing, oder execution — the Lighthouse audit’s own words. Shipping ein big bundle the Seite tut nicht benötigen bei load ist the classic cause.
• Inefficient JavaScript statements — heavy synchronous arbeiten that monopolizes the main thread.
• Drittanbieter- scripts — tag managers, chat widgets, analytics, ad scripts. häufig the single biggest contributor, und the one Sie Steuerung least.
• Heavy framework bootstrap — React hydration und similar kann ausführen long tasks during startup.
• Style/layout recalculation und garbage collection — forced synchronous layout, large style recalcs, und GC pauses zeigen up als main-thread tasks too; don’t assume every long task in the trace ist JavaScript execution.

Don’t assume bundle transfer size ist the whole story, either. Trace attribution hat real gaps: cross-origin frames und worker threads haben privacy und security limits auf war ein long-task observer kann Bericht über them (sehen Troubleshooting), so ein unattributed task in Ihre trace ist nicht proof kein third party ist involved — es may just bedeuten the attribution API ist nicht allowed zu mitteilen Sie.

wie zu fix high TBT

The fixes sind the gleich family als the INP fixes — both come down zu ein blocked main thread.

1. finden the long tasks. offen the Chrome DevTools Performance panel und look für tasks over 50 ms (sie sind flagged mit red corners), oder ausführen the Lighthouse “vermeiden long main-thread tasks” audit.
2. Audit Drittanbieter- scripts erste. sie sind usually the easiest wins. verwenden the DevTools Coverage und Network tabs zu sehen war jede script costs, und lazy-load heavy embeds (YouTube, maps, chat) behind ein facade.
3. Break up the long tasks. Yield zu the main thread so the browser kann handle input zwischen chunks — “wenn tasks sind broken up, the browser kann respond zu higher-priority arbeiten much sooner—einschließlich user interactions.” The modern API ist scheduler.yield(), mit ein setTimeout(resolve, 0) fallback (sehen the Cheat Sheets tab für the pattern). Note that Google kein longer recommends isInputPending() — yield regardless von whether input ist pending.
4. Reduce the JavaScript. Code-split large bundles so weniger parses und evaluates bei load, entfernen unused JS (DevTools Coverage tab zeigt Sie war), und defer non-critical scripts.
5. Move heavy computation off the main thread. Web Workers ausführen CPU-heavy arbeiten auf ein separate thread, leaving the main thread free zu respond.

ein nützlich side effect: long tasks that block the main thread kann auch delay Largest Contentful Paint rendering, so fixing TBT sometimes improves LCP too — especially wenn render-blocking JS ist involved.

wo zu go nächste

TBT lives in the Core Web Vitals family alongside its field counterpart Interaction to Next Paint, the loading metrics Largest Contentful Paint und First Contentful Paint, und the lab Tools Lighthouse, PageSpeed Insights, und Speed Index that Bericht them. wenn Sie nur remember one thing: TBT ist the lab warning light für field responsiveness — chase the long tasks, nicht the number.

AI summary

ein condensed nehmen auf the Advanced version:

• TBT = blocked main-thread time during load. es ist the total time, zwischen FCP und TTI, the main thread war blocked long genug zu verhindern input responsiveness.
• The math: sum von the blocking portion (duration − 50 ms) von every long task (any main-thread task over 50 ms). Tasks ≤50 ms hinzufügen 0 ms. Google’s worked Beispiel: tasks von 250/90/35/30/155 ms → 345 ms TBT.
• es ist ein lab metric. Sie sehen es in Lighthouse, PageSpeed Insights’ lab tab, und DevTools — never in CrUX oder Search Console.
• nicht ein Core Web Vital. The three CWV sind LCP, INP, CLS. TBT ist the lab proxy für INP (historically FID’s proxy; INP replaced FID auf March 12, 2024).
• Biggest Lighthouse weight: 30% — the single largest, so ein poor TBT tanks the overall score. Mobile thresholds: good ≤200 ms, benötigt improvement ≤600 ms, poor

  600 ms.

• Rankings: nicht ein direct Ranking factor. INP ist the field signal; TBT nur hilft diagnose es. Patrick’s nehmen: fix es für users und conversions, nicht für ein Ranking bump.
• Fixes (gleich family als INP): finden long tasks in DevTools, audit Drittanbieter- scripts erste, break up tasks mit scheduler.yield(), code-split und entfernen unused JS, offload heavy arbeiten zu Web Workers.
• Caveat: TBT und INP kann diverge — high TBT mit fine INP (users don’t interact during load) oder fine TBT mit poor INP (slow event handlers after load). Field Daten wins.
• “Lab-nur” bedeutet lab-recommended, nicht lab-impossible. Sie kann technically compute ein TBT-style total aus field data mit the Long Tasks API, aber Google advises against es (too much ausführen-zu-ausführen variance) — CrUX und Search Console simply never carry es either Weg.
• Trace attribution hat real gaps. Cross-origin frames und worker threads haben privacy/security limits auf war ein long-task observer kann Bericht, so ein unattributed task bedeutet “cause unknown,” nicht “kein third party involved.”

Offizielle Dokumentation

Primary-Quelle documentation auf TBT aus Google und the Chrome team.

Web.dev / Chrome

• Total Blocking Time (TBT) — Philip Walton & Barry Pollard: the canonical definition, the 50 ms long-task rule, und the worked Beispiel.
• TBT Lighthouse audit — the audit Seite, mit the mobile/desktop scoring thresholds und cited causes.
• Lighthouse performance scoring — the metric weights, wo TBT’s 30% comes aus.
• Web Vitals — warum TBT ist nicht ein Core Web Vital und wie es relates zu the festlegen.
• Interaction to Next Paint (INP) — the field metric TBT proxies, und the “proxy, nicht substitute” caveat.
• Optimize long tasks — Jeremy Wagner & Brendan Kenny auf breaking up tasks, scheduler.yield(), und warum isInputPending() ist kein longer recommended.
• Time to Interactive (TTI) — the metric that defines the end von the TBT window, und warum es war entfernt aus Lighthouse 10.
• Lab and field data differences — the limits von TBT als ein INP stand-in.

Quotes aus the Quelle

auf-the-record statements aus Google’s documentation. jede Link ist ein deep Link that jumps zu the quoted passage.

Definition und mechanics

• “the total amount von time after erste Contentful Paint (FCP) wo the main thread war blocked für long genug zu verhindern input responsiveness.” — Web.dev, Total Blocking Time. Jump to quote
• “ein task that läuft auf the main thread für mehr als 50 milliseconds” — the definition von ein long task. Jump to quote
• “zu bereitstellen ein good user experience, Websites sollte strive zu haben ein Total Blocking Time von weniger als 200 milliseconds wenn tested auf average mobile hardware.” Jump to quote
• “ein low TBT häufig correlates mit ein low Interaction zu nächste Paint (INP).” Jump to quote

Status: nicht ein Core Web Vital

• “Total Blocking Time (TBT) ist ein lab metrics ist vital in catching und diagnosing potential interactivity issues that kann impact INP. However, es ist nicht part von the Core Web Vitals festlegen weil they sind nicht field-measurable, nor tun they reflect ein user-centric outcome.” — Web.dev, Web Vitals (Philip Walton). (Grammar ist verbatim aus the Quelle.) Jump to quote

TBT als the INP proxy

• “in such cases, Total Blocking Time (TBT) may sein ein reasonable proxy metric für INP, aber es ist nicht ein substitute für INP in und von itself.” — Web.dev, Interaction zu nächste Paint. Jump to quote

Long tasks und fixing them

• “The main thread kann nur process one task bei ein time. Any task that takes longer than 50 milliseconds ist ein long task.” — Web.dev, Optimize long tasks. Jump to quote
• “wenn tasks sind broken up, the browser kann respond zu higher-priority arbeiten much sooner—einschließlich user interactions.” Jump to quote
• auf isInputPending(): “wir kein longer empfehlen Verwendung dies API, und stattdessen empfehlen yielding regardless von whether input ist pending oder nicht.” Jump to quote

TTI und warum TBT replaced es als the key interactivity number

• “Newer, alternative, metrics like Largest Contentful Paint (LCP), Total Blocking Time (TBT), und Interaction zu nächste Paint (INP) sind usually better metrics zu verwenden in place von TTI.” — Web.dev, Time zu Interactive (Philip Walton). Jump to quote

TBT-Triage-Checkliste

ein quick pass wenn Lighthouse hands Sie ein red (oder orange) Total Blocking Time:

• Confirm Sie sind reading lab Daten — TBT ist in Lighthouse / PageSpeed Insights’ lab tab / DevTools, nicht the field oder Search Console.
• offen the DevTools Performance panel und finden the long tasks (over 50 ms, red-cornered) zwischen erste paint und interactive.
• Liste Ihre Drittanbieter- scripts und war jede costs (Coverage + Network tabs) — beginnen hier; es ist usually the biggest, easiest win.
• Lazy-load heavy embeds (YouTube, maps, chat) behind ein facade.
• ausführen the Lighthouse “vermeiden long main-thread tasks” und “Reduce unused JavaScript” audits und arbeiten the Liste.
• Code-split large bundles so weniger JS parses/evaluates bei load.
• Defer non-critical scripts; dynamic-import() war ist nicht needed immediately.
• Break up remaining long tasks mit scheduler.yield() (setTimeout fallback). Don’t reach für isInputPending().
• Move CPU-heavy computation zu ein Web Worker.
• Cross-prüfen the field: pull INP aus CrUX / real-user monitoring. wenn INP ist fine, don’t over-invest in chasing the lab number.

TBT cheat sheet

Die Rechnung in einer Zeile

TBT = Σ (taskDuration − 50 ms) für every task > 50 ms zwischen FCP und TTI. Tasks ≤ 50 ms contribute 0 ms.

Worked Beispiel (Google’s)

Lighthouse-Schwellenwerte

(Thresholds vs. the Lighthouse subscore curve differ: 90+ ≈ ≤300 ms mobile, 100 ≈ ≤100 ms mobile — DebugBear’s dokumentiert figures, reverified live 2026-07-18.)

TBT vs. INP — der Spickzettel

Yield-zu-main pattern (the fix)

function yieldToMain () {
  if (globalThis.scheduler?.yield) {
    return scheduler.yield();
  }
  return new Promise(resolve => {
    setTimeout(resolve, 0);
  });
}

verwenden scheduler.yield() wo verfügbar, fall back zu setTimeout. Don’t verwenden isInputPending() — Google now recommends yielding regardless von whether input ist pending.

Tools für measuring und fixing TBT

• PageSpeed Insights — lesen TBT in the lab Daten section (es ist nicht in the field-Daten section, weil TBT ist nicht ein field metric).
• Lighthouse (Chrome DevTools → Lighthouse panel, oder the CLI) — the Quelle von the TBT number und the “vermeiden long main-thread tasks” / “Reduce unused JavaScript” audits.
• Chrome DevTools — Performance panel — record ein load und finden the long tasks (over 50 ms, flagged mit red corners) that machen up Ihre TBT.
• Chrome DevTools — Coverage tab — sehen wie much von jede script ist tatsächlich verwendet, zu target unused JavaScript und heavy third parties.
• WebPageTest — lab testing mit detailed main-thread und CPU breakdowns.
• Long Animation Frames (LoAF) API — ein modern, field-side complement zu TBT, nicht ein replacement für its lab load-window calculation: es attributes long animation frames across ein whole besuchen, welche ist closer zu wie INP problems tatsächlich surface, anstatt TBT’s single FCP-zu-TTI load window.
• Field-side TBT via the Long Tasks API — technically possible (sum duration − 50 ms für observed long tasks in production, gleich als the Scripts tab snippet), aber Google recommends against es für RUM: real user interaction timing macht the number too variable zu vergleichen ausführen over ausführen. Reach für INP oder LoAF für field responsiveness stattdessen.
• wo Sie wird nicht finden es: Google Search Console’s Core Web Vitals report und CrUX carry LCP, INP, und CLS nur — never TBT, regardless von war ist technically possible zu compute yourself.

TBT-Fehler, die zum falschen Fix führen

• Calling TBT ein Core Web Vital. TBT ist ein lab diagnostic und nützlich proxy für main-thread contention; INP ist the real-user Core Web Vital. Bericht them separately.
• Counting the whole long task als blocking time. nur the portion beyond 50 milliseconds counts. ein 70-millisecond task contributes 20 milliseconds, nicht 70.
• Optimizing outside the measurement window. Lighthouse TBT sums blocking zwischen FCP und TTI. arbeiten vor oder after that window may matter zu users, aber es ist nicht part von that TBT Wert.
• Removing Erstanbieter- code während ignoring the largest third party. verwenden the trace und Anfrage initiators zu attribute long tasks vor choosing ein owner oder fix.
• Splitting code ohne reducing arbeiten. viele smaller tasks kann verbessern responsiveness, aber shipping the gleich unnecessary JavaScript still costs parsing, compilation, und execution. entfernen unused arbeiten als well als yielding es.
• Assuming ein good lab TBT proves good field INP. Real users interact after load auf varied devices. Confirm the outcome mit field responsiveness Daten.

TBT ist high aber the network looks fast

Symptom: Resources download quickly, yet Lighthouse Berichte heavy blocking.

Likely cause: JavaScript parsing, compilation, execution, hydration, oder Drittanbieter- arbeiten monopolizes the main thread after the bytes arrive.

Fix und confirmation: Record ein Performance trace, sort long tasks durch duration und owner, then entfernen unused code, defer noncritical arbeiten, oder split the largest task. Confirm the blocking portion falls in repeated matched läuft.

ein large bundle ist deferred aber TBT stays high

Symptom: Adding defer Änderungen download/execution order ohne materially moving TBT.

Likely cause: The gleich expensive code still executes inside the FCP-zu-TTI window.

Fix und confirmation: Profile functions inside the long task. Code-split durch route oder interaction, reduce hydration, oder entfernen unused/duplicate arbeiten; then überprüfen that execution time, nicht merely Anfrage beginnen time, declines.

Lighthouse TBT ist good während field INP ist poor

Symptom: Navigation lab Tests look responsive, aber CrUX oder RUM Berichte slow interactions.

Likely cause: The problematic task occurs after initial load oder nur after ein real interaction that standard Lighthouse navigation tut nicht exercise.

Fix und confirmation: Collect interaction traces für the poor INP Seiten und devices, reproduce the action locally, und optimize the event handling und nächste paint.

ein long task zeigt up mit kein klar owner

Symptom: DevTools oder ein Long Tasks API observer flags ein blocking task, aber the attribution ist blank, generic, oder labeled something like “unknown” / “cross-origin.”

Likely cause: dies ist ein known coverage gap, nicht ein measurement error. The Long Tasks API’s own specification bounds war es will Bericht across execution contexts — cross-origin ancestor tasks sind deliberately nicht reported (“dies ist nicht reported weil von security”), und ein deeply embedded cross-origin iframe “tut nicht receive any Informationen” über ein long task in ein cross-origin ancestor. arbeiten happening in ein Web Worker oder the browser’s compositor thread kann auch fall outside war the attribution surfaces Sie.

Fix und confirmation: Don’t conclude “kein third party ist involved” just weil nothing ist named. Cross-prüfen mit the Network panel’s initiator column, the Coverage tab, und (wo Sie Steuerung the script) Erstanbieter- instrumentation inside iframes Sie own. Treat ein unattributed task als “cause unknown,” nicht “cause absent.”

TBT varies sharply zwischen läuft

Symptom: One ausführen ist green und the nächste ist poor mit kein deployment.

Likely cause: Variable Drittanbieter- execution, server timing that Änderungen the arbeiten window, cache state, oder testen-machine contention.

Fix und confirmation: Match settings, ausführen several cold Tests, und vergleichen the long task owners und median Ergebnis anstatt selecting one score.

Turn ein trace into ein ownership plan

Review this Lighthouse/DevTools trace for Total Blocking Time. For every long task
between FCP and TTI, calculate only duration above 50 ms as blocking time, attribute
the task to first-party code, framework/hydration, or a named third party, and rank
owners by blocking contribution. Propose remove, reduce, defer, split, or yield actions
with a validation test for each. Do not treat TBT as field INP or a direct ranking
factor.

vergleichen two performance traces

Compare these before/after traces under matched settings. Report FCP, TBT, the largest
long tasks, their initiators, and whether work moved outside the measurement window or
was actually removed. Flag regressions hidden by the aggregate score. Return a verdict,
confidence limits from the supplied runs, and the next smallest experiment. Do not
invent missing timings.

prüfen ein Drittanbieter- script decision

Given this script's business purpose, loading pattern, request initiator, and main-
thread tasks, decide whether to keep, delay, conditionally load, replace, or remove it.
Separate network cost from execution/blocking cost. Include consent and functionality
constraints, owner, implementation step, TBT validation, field-INP follow-up, and
rollback trigger.

Observe long tasks during ein reproduction

ausführen dies early in DevTools Console, reproduce the load oder interaction, und inspect jede task’s blocking portion:

let observedBlocking = 0;
const observer = new PerformanceObserver(list => {
  for (const task of list.getEntries()) {
    const blocking = Math.max(0, task.duration - 50);
    observedBlocking += blocking;
    console.log({ start: task.startTime, duration: task.duration, blocking });
  }
  console.log('Observed blocking total:', observedBlocking);
});
observer.observe({ type: 'longtask', buffered: true });

dies ist ein debugging total für the period Sie observe, nicht Lighthouse’s official TBT unless Sie deliberately reproduce the gleich FCP-zu-TTI window und testen conditions.

Flag scripts mit the meisten main-thread evaluation time

After recording ein DevTools Performance trace, verwenden the Bottom-up view grouped durch URL. für ein quick network inventory alongside es, dies Console snippet Listen transferred JavaScript aus largest zu smallest:

performance.getEntriesByType('resource')
  .filter(r => r.initiatorType === 'script')
  .map(r => ({ script: r.name, transferred: r.transferSize, duration: r.duration }))
  .sort((a, b) => b.transferred - a.transferred);

Large transfer size ist nur ein lead; the Performance trace ist war attributes parsing und execution time zu TBT.

Reduzierung langer Aufgaben

testen zu ausführen: Capture several matched Lighthouse/Performance traces vor und after the JavaScript ändern und vergleichen long tasks zwischen FCP und TTI.

Expected Ergebnis: The targeted task disappears, shortens, oder yields into smaller tasks, und median TBT improves ohne delaying FCP oder breaking functionality.

Failure interpretation: arbeiten moved zu another bundle/task, still executes in the gleich window, oder normal ausführen variance ist larger than the ändern.

Monitoring window: testen immediately in mobile und desktop lab profiles und watch field INP during the nächste reporting window.

Rollback trigger: Roll back wenn critical interactions break, errors rise, oder ein repeatable FCP/LCP/INP regression outweighs the TBT improvement.

Drittanbieter- deferral

testen zu ausführen: vergleichen ein cold trace mit the third party in its current position und mit es delayed until consent, idle time, oder the relevant interaction.

Expected Ergebnis: Its long tasks leave the initial TBT window während the erforderlich business event still fires bei the intended time.

Failure interpretation: Another loader injects es early, dependent code blocks the Seite, oder the script’s main-thread arbeiten ist nicht the measured bottleneck.

Monitoring window: Validate auf every template that loads the script und monitor both performance und the business event after release.

Rollback trigger: Restore the prior loading path wenn consent, analytics, checkout, ads, oder another erforderlich function loses valid events.

Field responsiveness folgen-up

testen zu ausführen: Segment field INP für affected templates/devices after the lab TBT ändern während keeping the deployment date annotated.

Expected Ergebnis: Field responsiveness stays stable oder improves; ein lab-nur win ist nicht reported als ein user outcome until field Belege supports es.

Failure interpretation: Real interaction arbeiten occurs outside initial load oder the optimized cohort ist too small zu move the aggregate.

Monitoring window: prüfen durch the full field-Daten reporting window und during high-Wert interactions.

Rollback trigger: Investigate oder roll back wenn field INP oder critical interaction success regresses consistently after the release.

testen yourself: Total Blocking Time

Five quick questions auf TBT math und diagnosis. Pick ein Antwort für jede, then prüfen.

Resources worth Ihre time

Official

• Total Blocking Time (TBT) — the canonical definition und worked Beispiel.
• Optimize long tasks — the practical fixing Leitfaden (scheduler.yield(), batching, warum nicht isInputPending()).
• Web Vitals — wo TBT sits relative zu the Core Web Vitals.
• Optimizing Web Vitals using Lighthouse — Addy Osmani; enthält the polyfill-removal worked Beispiel (TBT 400→300 ms, score 63→70).

aus others (überprüfen vor quoting)

• DebugBear — Total Blocking Time — strong technical depth auf the TBT↔INP mechanism und the Lighthouse scoring curve.
• NitroPack — What is Total Blocking Time? — the “task count ≠ blocking time” insight.
• BrowserStack — TBT guide und Catchpoint — TBT — tool/monitoring-oriented overviews.
• web.dev — User-centric performance metrics — Philip Walton’s framework classifying TBT als ein lab/load-responsiveness metric vs. field metrics; nützlich framing für explaining warum TBT tut nicht erscheinen in CrUX.
• web.dev — Getting started with measuring Web Vitals — deckt ab wie TBT serves als the lab proxy für INP wenn real-user measurement ist nicht possible in simulated environments.
• WebPageTest — free lab testing Tool that Berichte TBT alongside detailed main-thread und CPU breakdowns; nützlich für diagnosing welche tasks sind driving ein high score.
• Search Engine Journal — Core Web Vitals coverage — ongoing industry reporting auf CWV Aktualisierungen, TBT’s role in audits, und wie practitioners interpret lab vs. field gaps.

Zitierfähige Statistiken

• TBT ist 30% von the Lighthouse Performance score — the single largest weight von any metric (LCP und CLS sind 25% jede; FCP und Speed Index 10% jede). Introduced in Lighthouse 10, live-reverified 2026-07-18 als unchanged durch Lighthouse 13. Source
• The “good” bar ist ≤200 ms auf mobile (≤150 ms desktop); “poor” ist >600 ms mobile (>350 ms desktop) — Lighthouse audit docs. Source
• One polyfill = seven points. Removing ein single Intersection Observer polyfill cut TBT aus 400 ms zu 300 ms und lifted the Lighthouse Performance score aus 63 zu 70 — ein clean illustration von the 30% weight. Source
• ein 250 ms task contributes 200 ms von blocking time — the blocking portion ist immer duration − 50 ms. Google’s worked Beispiel totals 345 ms across five tasks. Source

Änderungsprotokoll