Browser & Frontend Runtime
Lab vs field: why the two disagree and how to use each
PageSpeed Insights shows LCP 1.8 s in the Lighthouse section — green, good. The field data section shows LCP 3.9 s at p75 — red, poor. The team says “the lab says we are fine.” They ship nothing. Three months later, Search Console still shows poor LCP. The lab score and the ranking are measuring different things. Knowing which one is the verdict changes everything.
Lab data vs field data — two different questions.
Lab data is a synthetic measurement: a tool like Lighthouse or DevTools loads the page once, on a simulated device and a throttled network, in a controlled environment. It is fully reproducible and it can attribute problems precisely — great for debugging. One device, one network, one moment. If you change the page and rerun, the result is comparable.
Field data is real-user monitoring: the actual Core Web Vitals experienced by real visitors on their real devices and networks, aggregated. Google’s public field dataset is CrUX — the Chrome User Experience Report. It aggregates visits from opted-in Chrome users, and the field p75 from CrUX is what Search ranking uses.
They disagree routinely because they measure different things. A lab run on a simulated fast device shows an LCP that a quarter of real users — on older phones, on congested 4G — never come close to. INP barely exists in the lab at all, because lab tools do not script realistic interaction sequences; the lab proxy is Total Blocking Time (TBT). CLS in the lab is close to real, but dynamic content that appears only with real user sessions can be missed.
- Lab (Lighthouse, DevTools)
- Synthetic, reproducible, debuggable
- Field (CrUX, web-vitals RUM)
- Real users, real devices, real networks
- What drives Search ranking
- CrUX field p75
- Lab INP proxy
- Total Blocking Time (TBT)
- Rule
- Debug in lab; judge in field
The rule: debug in the lab, judge in the field.
Use the lab to reproduce and attribute a problem (fast, deterministic, easy to bisect commits), and to gate regressions in CI (Lighthouse CI runs on every PR, fast, no real users needed). Use the field p75 as the verdict on whether a page is actually good for users and whether it will rank. A lab improvement that does not move the field p75 did not help your users. Only the field number is the truth.
The supporting diagnostic metrics.
The three Core Web Vitals sit on top of a layer of diagnostic metrics that are not scored for ranking but are essential for understanding them:
- TTFB (Time to First Byte) — the server-and-network portion. It is the floor under LCP: LCP can never be faster than TTFB.
- FCP (First Contentful Paint) — when the first pixel of content appears, vs LCP’s largest. A large FCP-to-LCP gap means the page shows something quickly but the main content lags — a sign the LCP resource has load delay.
- TBT (Total Blocking Time) — the sum of the blocking portion of every long task during load. This is the lab proxy for INP: you cannot measure true INP in a lab (it needs real interactions), so CI gates use TBT instead. A high TBT predicts a high INP.
Knowing these is what lets you read a Lighthouse report fully — Lighthouse never just says “LCP is bad”, it shows TTFB and FCP so you can see where in the chain the time went.
Reading a DevTools performance trace.
Open DevTools, the Performance panel, record a page load and an interaction. The trace shows several tracks:
- Timings track: marks FCP, LCP, and DCL with vertical lines. Hovering the LCP marker names the exact element.
- Frames track: each rendered frame; layout shifts appear as red markers — click to see which nodes shifted.
- Main track: flame chart of main-thread work; long tasks are flagged with a red corner.
- Interactions track: click/tap events, broken into input delay, processing, and presentation delay — color-coded — so you can see which part dominates for each interaction without guessing.
The INP workflow: interact during the recording, find the interaction in the Interactions track, read the three-part split. The LCP workflow: find the LCP marker in the Timings track, hover to identify the element, then look at the network waterfall above it to see when the resource was requested vs when it downloaded vs when the element painted.
Why this works
Why is p75 used rather than the median? Median performance is pulled down by fast outliers — developers on fast Wi-Fi, cached repeat visits. The 75th percentile focuses attention on the slow quarter of real users: those on older phones, mobile networks, or less powerful CPUs. A change that improves the median but not p75 helped the already-fast users and did nothing for the users who needed it most. p75 is the threshold that makes the optimization target the tail of the distribution, not its center.
PageSpeed Insights shows LCP 1.8 s in the Lighthouse (lab) section — good — but the field data section shows LCP 3.9 s at p75 — poor. The team says 'the lab says we are fine'. Who is right?
Google publishes a public dataset of real-user Core Web Vitals, aggregated from actual Chrome visits, and Search ranking is based on it — not on any lab test. What is that field dataset called?
A 'good' INP score requires interaction latency at or below how many milliseconds, at the 75th percentile?
- 01Explain the lab-vs-field distinction and give the rule for when to use each.
- 02Why is Total Blocking Time used as the INP proxy in CI, rather than measuring INP directly?
- 03In a DevTools performance trace, what does the Interactions track show for a slow interaction, and how do you use it to diagnose INP?
Lab data — from Lighthouse or DevTools — is synthetic: one device, one network, reproducible, great for debugging and CI regression gates. Field data — CrUX — is from real Chrome users at p75, and it is what Search ranking uses. They disagree routinely because real user diversity (slower phones, congested networks) is not captured in a single simulated run. INP barely exists in the lab because lab tools do not simulate real interactions; the lab proxy is Total Blocking Time. The rule is: debug in the lab, judge in the field. TTFB, FCP, and TBT are the supporting diagnostic metrics under the three Core Web Vitals — knowing them is what lets you read a Lighthouse report and trace where in the chain time was lost. A lab improvement that does not move the field p75 did not help your users; only the field number is the real verdict.
appears again in193
- The journey of a request: seven stops from socket to responsejunior
- Accept and parse: from kernel queue to a typed requestmiddle
- Routing and middleware: choosing what runs, and in what ordermiddle
- Handler and response: from business logic to bytes on the wiremiddle
- Streaming and backpressure: when the client reads slower than you writesenior
- Timeouts and tail latency: budgets, deadlines, and the fan-out trapsenior
- Middleware and DI: the two patterns that shape every backendjunior
- Writing middleware: signatures, next(), and the three framework modelsmiddle
- Inversion of control: how dependencies reach a classmiddle
- DI scopes and lifecycles: singleton, request, transientmiddle
- DI as a testing seam: fakes, mocks, and the boundary that matterssenior
- DI containers in production: resolution graphs, circular deps, and when not tosenior
- Blocking vs non-blocking I/O: two ways to waitjunior
- The event loop: one thread, ordered phasesmiddle
- What blocks the loop: CPU work and sync callsmiddle
- Offloading CPU work: worker threads and the libuv poolmiddle
- Backpressure and bounded concurrencysenior
- Throughput under load: tail latency and saturationsenior
- Why pool: the cost of creating a connectionjunior
- Pool sizing: why bigger is not fastermiddle
- Acquisition and timeouts: the wait queue is the real latency dialmiddle
- Retry strategies: backoff, jitter, and thundering herdmiddle
- Observability, production failures, and global-scale designsenior
- What an index is and how it speeds up queriesjunior
- The leading-column rule and composite index designmiddle
- Partial, expression, and covering indexesmiddle
- Index types: GIN, GiST, BRIN, Hash, Bloom, and HOT updatesmiddle
- Index-only scans, the Visibility Map, and INCLUDEsenior
- Production failure modes and the index audit playbooksenior
- Index design exercise: full-text search strategysenior
- EXPLAIN and execution plans: what the planner decides and whyjunior
- Scan types: Seq, Index, Bitmap, Index-Onlymiddle
- Join algorithms and the row-estimate cascademiddle
- pg_statistic, ANALYZE, and production observabilitymiddle
- Extended statistics: fixing correlated-column estimate failuressenior
- Plan cache, cost-constant tuning, and planner internalssenior
- Production failure modes and plan stabilitysenior
- Connection pools: amortising the cost of a Postgres backendjunior
- PgBouncer session, transaction, and statement modesmiddle
- Pool sizing: the (cores × 2) + spindles formula and the two-layer stackmiddle
- Pool exhaustion and idle-in-transaction: the 3 AM failure modemiddle
- Migrating to transaction mode: rollout playbook and PgBouncer 1.21 prepared statementsmiddle
- The Postgres process model and why raising max_connections degrades throughputsenior
- Pooler landscape 2026, serverless connection storms, and the full failure-mode taxonomysenior
- ADD COLUMN: instant in PG 11+ vs rewrite in older Postgresjunior
- The lock-queue failure mode: why instant DDL can freeze the databasemiddle
- Safe DDL patterns: NOT VALID, CONCURRENTLY, and unsafe-op fixesmiddle
- Migration failure taxonomy and production disciplinesenior
- Shard-key selection: hash, range, list, and directory strategiesmiddle
- Co-location and Citus: the invariant that makes sharding usablemiddle
- The hot-shard failure mode: detection, isolation, and durable policymiddle
- Online resharding, 2PC, and the operational cost of shardingsenior
- The seven acts: from CREATE TABLE to Citusjunior
- Acts 1–3 in depth: schema, indexes, and planner statisticsmiddle
- Acts 4–6 in depth: MVCC bloat, connection pooling, and safe migrationsmiddle
- Act 7 in depth: sharding, co-location, and the seven-tier tradeoff cascademiddle
- Observability, anti-patterns, and production triagesenior
- Bits on the wirejunior
- Latency mathmiddle
- Bufferbloat and congestionsenior
- The physical frontiersenior
- Sequence numbers and connection statemiddle
- Flow control and congestion controlmiddle
- BBR, production observability, and beyond TCPsenior
- CDN: putting content next doorjunior
- Anycast and GeoDNS: routing to the nearest edgemiddle
- Tiered cache and Cache-Controlmiddle
- Vary header and cache keysmiddle
- Stale-while-revalidate and cache stampedesenior
- Edge workers and edge-side compositionsenior
- CDN operations and observabilitysenior
- WebSocket: the HTTP upgrade handshakejunior
- WebSocket vs SSE vs long-polling: choosing the right transportmiddle
- WebSocket backpressure: when clients can''''t keep upmiddle
- Reconnection: jittered backoff, thundering herd, message resumptionsenior
- WebSocket at scale: HTTP/2 multiplexing, permessage-deflate, C10Msenior
- WebSocket in production: proxies, security, and distributed architecturesenior
- What reverse proxies dojunior
- Balancing algorithms: round-robin to power-of-two-choicesmiddle
- L4 vs L7 load balancing and client-IP preservationmiddle
- Health checks, connection draining, and slow startmiddle
- Retry storms, circuit breakers, and load sheddingsenior
- Resilient LB architecture: anycast, zone-aware routing, and observabilitysenior
- Why QUIC and not TCP+TLSjunior
- QUIC streams and head-of-line blockingjunior
- Integrated handshake and 1-RTTmiddle
- Connection IDs and network migrationmiddle
- Loss detection and congestion controlmiddle
- 0-RTT resumption and packet encryptionsenior
- Deployment tradeoffs and CPU costsenior
- DDoS: what it is and why it worksjunior
- Amplification attacks and state exhaustionmiddle
- Rate limiting: algorithms and architecturemiddle
- WAFs, firewalls, mTLS, and HSTSmiddle
- DNS cache poisoning and BGP hijackingsenior
- Defense-in-depth architecture and attack economicssenior
- The twelve layers: one URL, seven actorsjunior
- DNS, TCP, TLS in sequence: where the milliseconds gomiddle
- Critical render path and Core Web Vitalsmiddle
- Proxy intercepts and security gates: rate limiters, WAF, mTLSmiddle
- Alternate paths: QUIC 0-RTT, WebSocket upgrade, connection migrationmiddle
- Observability: distributed traces, USE/RED, and samplingsenior
- Resilience: cascading retries, circuit breakers, and error budgetssenior
- What the three signals are: logs, metrics, and tracesjunior
- Metrics and cardinality: the cost model of a time-series databasemiddle
- Logs and volume: the cost model of structured loggingmiddle
- Traces and sampling: the cost model of distributed tracingmiddle
- Join keys and exemplars: making the three signals composemiddle
- Observability 2.0: wide events and the cost shiftsenior
- Failure modes and engineering practice: cardinality budgets, PII, and samplingsenior
- Why structured logs exist: the diary vs the spreadsheetjunior
- The production log schema: fields every line must carrymiddle
- Log levels and alert routingmiddle
- Sampling strategies and log costmiddle
- PII redaction and log injectionsenior
- Trace context propagation in logssenior
- OTel Logs Data Model and audit logs as a subsystemsenior
- OTel signals, Semantic Conventions, and the OTLP wire formatmiddle
- Auto-instrumentation and manual spans: the 80/20 of OTelmiddle
- The OTel Collector: receivers, processors, exporters, and deployment patternsmiddle
- Sampling strategies: head, tail, and parent-basedmiddle
- Vendor neutrality, eBPF instrumentation, the Operator, and browser/serverless OTelsenior
- Operating the OTel Collector: reliability, version skew, failure modes, and governancesenior
- RED and USE: two checklists, one triage disciplinejunior
- Instrumenting RED in Prometheus: counters, histograms, and cardinality disciplinemiddle
- USE on Linux: CPU, memory, disk, network, and PSImiddle
- Golden signals, dashboard layout, and service mesh auto-REDmiddle
- Cardinality as a cost driver: labels, PII, exemplars, and samplingmiddle
- Native histograms, SLO tie-in, and production failure patternsmiddle
- Choosing SLIs and SLO targets: ratios, not feelingsmiddle
- Multi-window multi-burn-rate alerting: why AND beats ORmiddle
- Error budget policy, latency SLOs, and composite journeysmiddle
- Iceberg SLIs, composite SLO math, and SLA vs SLOsenior
- Flame graphs: reading the picture that shows where time goesjunior
- Sampling vs instrumentation profiling: why 99 Hz wins in productionmiddle
- Profile types: CPU, memory, off-CPU, mutex — which one to reach formiddle
- Continuous profiling: always-on flame graphs with eBPF and trace-id correlationmiddle
- How flame graphs are built from samples, and the production workflows that use themmiddle
- Linux perf, eBPF internals, PGO, and the limits of samplingsenior
- Profiling in production: security, war stories, OTel profiles, and the infrastructure designsenior
- The debugging funnel: SLO → RED → trace → profilejunior
- OTel architecture: one SDK, four signals, one wire formatmiddle
- Cost discipline: keeping observability under 5% of infra spendmiddle
- Scale, security, and the ROI of observable systemssenior
- Why profile first: measure where time actually goesjunior
- Amdahl''''s law and self-time: the ceiling on every speedup you can shipmiddle
- The measurement loop: microbench, macrobench, prod profile, observer effectmiddle
- Reading flame graphs: shapes, per-language profilers, and the 60-second scanmiddle
- Statistical baselines: why one run is not a measurementmiddle
- Profiler history and microbenchmark pitfalls: Knuth to GWPsenior
- Hardware counters, cold-start profiles, and profile securitysenior
- Continuous profiling at scale: costs, CI gates, trace correlation, and anti-patternssenior
- What makes a hot path: symptom vs causejunior
- Five shapes of hotspot: CPU, alloc, cache, lock, syscallmiddle
- Reading parent and child chains: where to apply the fixmiddle
- JIT deopt, the fix-and-verify loop, and PR-time profilingmiddle
- Hardware counters and Intel TMA: sub-category diagnosissenior
- False sharing and native-bridge hot pathssenior
- Hot paths in production: security, tail latency, and tooling lineagesenior
- Memory hierarchy: why the same O(N) loop can be 17x slowerjunior
- Row-major vs column-major: access order and the 9x gapjunior
- Branch prediction and branchless codemiddle
- Hardware prefetcher, TLB, and memory-level parallelismsenior
- GC basics: what the runtime taxes you forjunior
- GC algorithms: generational, concurrent, and per-runtimemiddle
- GC tradeoffs: pause, throughput, heap — and object poolingmiddle
- GC tuning: pacing, heap shape, and allocation observabilitymiddle
- GC internals: tri-color invariant, write barriers, and per-runtime deep-divessenior
- GC in production: observability, security, edge cases, and fleet governancesenior
- N+1: one logical operation, many round-tripsjunior
- Fix families: JOIN, IN, preload, and DataLoadermiddle
- Detecting N+1: query logs, APM traces, and CI gatesmiddle
- DataLoader: batching across resolver treesmiddle
- Cross-protocol N+1: HTTP fan-out and Redis MGETmiddle
- N+1 at scale: pool exhaustion, plan changes, and denormalisationsenior
- Batching: amortize fixed cost per operationjunior
- The batching window: size and wait timemiddle
- Batching in Kafka and Postgresmiddle
- io_uring and observability of batchingmiddle
- From Nagle to io_uring: evolution of batchingmiddle
- Backpressure, failure isolation, and batch security in productionsenior
- What a bundle actually costs: download, parse, compile, executejunior
- Core Web Vitals: LCP, INP, and CLSmiddle
- Code splitting: route-level, component-level, vendor splittingmiddle
- Tree shaking and compression: removing what you don''''t usemiddle
- Third-party scripts: the silent budget killermiddle
- CI enforcement and RUM: making budgets stickmiddle
- V8 JIT pipeline, HTTP priorities, and bundle securitysenior
- The performance loop: discipline, not a projectjunior
- Classify and fix: matching bottleneck families to remediesmiddle
- Observability stack and CI gates: catching regressions before they shipmiddle
- Incident to enforcement: SLO burn to verified fix in 35 minutesmiddle
- Culture, economics, and org-scale performancesenior