Chrome DevTools MCP: live evidence, explicit scope and verifiable browser work
Measure browser-agent performance without mixing lab traces, field data and image size
Design controlled browser trials and distinguish telemetry latency, trace evidence, CrUX data and screenshot transport costs.
What you will learn
- Fix the browsing scenario before comparing results
- Field experience and a local trace are different evidence
- Screenshot bytes and reading cost are not identical
Before you start
- Basic browser console and network concepts
- Understanding of CLI arguments and local client configuration
Plan a scoped browser investigation and distinguish interface defaults, tool success and end-to-end acceptance.
Key takeaways
- Compare the same controlled browsing scenario.
- CrUX field context and local traces are different datasets.
- Smaller image files do not automatically imply proportional token savings.
Fix the browsing scenario before comparing results
Record the page revision, viewport, device and network conditions, browser state and exact interaction. A fresh-profile run and a warm signed-in session may perform different work. Repeating a trace under changing conditions does not isolate the effect of a code change.
Keep tool latency, browser startup, navigation, trace collection and agent interpretation separate. The README’s usage statistics include operational measurements, but tool invocation success is not a user-experience benchmark. We recorded no live trace or site speed result in this series.
Field experience and a local trace are different evidence
The README says performance tools may send trace URLs to CrUX for real-user experience context. A local trace describes the measured run; field data describes a different population and observation window. One should not be substituted for the other or described as the result of the same laboratory experiment.
If the page URL is sensitive or the request is outside the task, disable performance CrUX sharing deliberately. That setting does not disable the separate usage-statistics system or npm update checks. Record which sources were enabled when interpreting an analysis report.
Screenshot bytes and reading cost are not identical
Configuration exposes image format, quality and maximum dimensions. Compression changes transfer size; reducing dimensions changes visual information and may affect model image processing differently. Do not claim a fixed token-saving percentage without measuring the actual client and model pipeline.
Prefer the smallest observation that still answers the diagnostic question. A text snapshot may be useful for labels, while a targeted screenshot is useful for layout. Keep enough resolution to inspect the defect and report unknown cost measurements honestly; no speedup or cost reduction was measured here.
Decision guide
| Criterion | Option A | Option B |
|---|---|---|
| Best when | You need predictable behavior and easy auditing | You need adaptive optimization and have reliable telemetry |
| Main risk | May leave performance on the table | Can become difficult to explain or debug |
Implementation steps
- 1
Record scenario and browser conditions.
- 2
Separate startup, tool and analysis time.
- 3
Identify local versus field evidence.
- 4
Tune observation size without losing the needed detail.
Copy-ready example
{
"trialPlan": true,
"pageRevision": null,
"viewport": null,
"localTraceMs": null,
"fieldDataEnabled": false,
"toolLatencyMs": null,
"imageBytes": null,
"modelCost": null,
"benchmarkExecuted": false
}Frequently asked questions
Is CrUX the same as the trace I just recorded?
No. It supplies field context rather than the same local run.
Does halving JPEG bytes guarantee half the image tokens?
No. Processing depends on dimensions and the client/model pipeline, not bytes alone.
Sources
- Chrome DevTools MCP / README.mdSource checked 2026-09-14
- Chrome DevTools MCP / docs/configuration.mdSource checked 2026-09-14