Critical Request Chain Mapper
Follow the requests that wait on one another. Build a dependency map, expose broken links and compare a proposed loading plan before changing your code.
Dependency map
Repair the graph before trusting a total
Request inspector
Add or import a request to begin.
Request ledger
| Request | Type | Duration | Modeled start → finish | Slack to goal | Waits for |
|---|
A dependency model you can explain
- Declare the waits. Import a request list or build the map. Use the browser’s Initiator evidence to verify dependencies; timing order alone does not prove a link.
- Follow the chain. Inspect the baseline. Each request starts after its last finishing parent; independent branches run in ideal parallel. Fix missing parents and cycles.
- Test a proposal. Change a duration or discovery dependency. A different branch can become the bottleneck. Export your assumptions, implement a feasible change and measure again.
Supported files and limits
Open a JSON array, an object with requests/rows, or a version 2 saved project. CSV needs requestId,url,durationMs,dependsOn; separate parent IDs with |. Optional label, type, proposedMs, proposedParentsJSON and notes are supported. Up to 5,000 requests, 20,000 dependency links across both models and 8 MiB. Large maps display up to 80 requests; selecting a request focuses its neighborhood. The ledger and JSON report cover the complete graph.
This is a conceptual dependency model, not a browser performance trace or Lighthouse audit. It does not infer render-critical requests, crawl URLs, import HAR initiators, predict LCP, or simulate connection limits, discovery delays, bandwidth contention and CPU work. Supplied durations and hard finish-to-start dependencies are your assumptions. Public pages include advertising; see privacy information.
Reference: request chains and network dependencies · inspect browser initiators.
Using Critical Request Chain Mapper
Build an explicit request dependency graph, inspect controlling chains, diagnose missing links and cycles, and compare a proposed loading scenario.
- Try the product-page example. Its declared baseline completes in 700 ms; the proposal completes in 560 ms and moves the modeled bottleneck to the availability badge.
- Import a JSON request list, CSV or version 2 saved project. Confirm the page URL and choose all requests or a specific completion goal. Dependencies use request IDs and mean hard finish-to-start waits.
- Select a map node or use Jump to request. Edit baseline duration/dependencies, then test a proposed duration or parent list. Apply or discard edits before switching. Renaming IDs updates all references.
- Review both controlling chains, graph diagnostics and the request ledger. Save/reopen a project, export structured CSV or JSON analysis, or download a printable review brief. Measure the real browser after implementing a feasible change.
Example
The baseline follows document → css → theme → font, totaling 700 ms. Linking the theme directly from HTML and proposing a smaller font changes the font branch to 460 ms, but the document → app → inventory → badge branch still takes 560 ms. The modeled overall difference is 140 ms, not 240 ms.
Questions & answers
Does this predict my actual page-load time or LCP?
No. It computes an ideal dependency model from supplied durations. Independent branches run in parallel and a request waits until all declared parents finish. It does not model network limits, transfer contention, CPU, discovery delays or render-critical resource classification.
Where do dependencies come from?
You supply them as request IDs in an array or a pipe-separated dependsOn field. Verify them with browser initiator evidence; timing order alone does not prove a dependency. This tool does not infer dependencies from HAR or fetch the request URLs.
What happens with missing parents or cycles?
They remain visible as graph problems. Cyclic nodes and downstream blocked requests are distinguished. An unresolved chain cannot receive a trustworthy completion total. A selected valid goal can still be modeled when unrelated branches are unresolved.
Why does an improvement change the controlling chain?
A shorter branch can expose another bottleneck. The highlighted set includes tied controlling paths; the comparison shows one representative chain. Slack is modeled time by which a request could slip before affecting the selected completion goal under the same assumptions.
How do scenarios work?
Baseline values are preserved. An empty proposed duration inherits the baseline; zero is a valid proposal. Keep baseline dependencies inherits the original parent list. Uncheck it to supply a different list, or leave it empty to model an independent root. These are assumptions to verify in real code.
What files and graph sizes are supported?
JSON arrays, requests/rows objects, version 2 projects and CSV are supported, up to 5000 requests, 20000 links across both models and 8 MiB. Large diagrams show up to 80 requests around the selection; the ledger and report retain the full graph. CSV includes JSON-encoded text for exact round trips.
Can I remove a request or rename it safely?
Renaming an ID updates baseline and scenario references and the selected goal. Removing a request preserves references as missing-parent diagnostics, so dependencies are never silently discarded. Undo restores the last plan change.
Help improve this tool
Report a problem or suggest an improvement
Describe the issue without pasting private tool input. Feedback goes to our admin inbox.
