API Latency Monitor

═══════════════════════════════════════════════════════════════ PART 1 — DETAILED DESCRIPTION (paste into the store listing) ═══════════════════════════════════════════════════════════════ See exactly how fast every API call on your page really is — and where the time actually goes. API Latency Monitor watches every network request your browser makes, measures how long each one takes, and rates it Good, Average, or Poor so you can spot a slow endpoint at a glance. No DevTools to open, no recording to start, no waiting. It runs quietly from the moment Chrome opens. Built for developers, QA engineers, and anyone who has ever asked "why is this page so slow?" and wanted an answer in seconds rather than a scavenger hunt through the Network tab. WHY THIS EXISTS The DevTools Network tab is powerful, but it only helps if you remembered to open it before the slow request happened. If you didn't, you reload and hope it reproduces. And when you finally catch it, you still have to work out whether the delay was DNS, the TLS handshake, or your backend chewing on the request. API Latency Monitor flips that around. It's always recording, so the data is already there when you go looking. And it doesn't just tell you a call took 1.8 seconds — it tells you that 1.7 of those seconds were the server thinking, which means the problem is your backend, not the network. WHAT IT DOES ALWAYS ON, ZERO SETUP Starts monitoring the instant Chrome launches. There is no record button, no "start capturing" step, and nothing to remember. If a request was slow, it's already in the log. INSTANT GOOD / AVERAGE / POOR VERDICT Every call is rated against latency thresholds you control: • Good — 300 ms or less • Average — up to 1000 ms • Poor — over 1000 ms Failed requests are always counted as Poor. Adjust the thresholds in Settings to match what "fast" means for your own API. THE TOOLBAR TELLS YOU BEFORE YOU EVEN CLICK The extension badge shows a green "OK" while everything on the current page is healthy, or a red count of poor requests when something is dragging. You'll notice a regression without opening anything. FULL TIMING BREAKDOWN PER REQUEST This is the part that actually saves you time. Expand any request and you get a waterfall showing where every millisecond went: • Stalled / queued — waiting before the connection work even begins • Redirect — time lost following redirects • DNS lookup — resolving the hostname • TCP connect — establishing the connection • TLS handshake — negotiating HTTPS • Waiting (TTFB) — request sent to first byte back. This is your server's real processing time. • Content download — first byte to last byte Once you can see the split, diagnosis becomes obvious. TTFB dominating? Your backend is slow — go look at the endpoint. DNS and TLS eating the budget? It's connection setup, usually a cold connection rather than a slow API. Download dragging? You're shipping too many bytes. Each row also shows a compact color-coded phase strip inline, so you can often spot the culprit without expanding anything at all. COMPLETE REQUEST DETAILS Alongside the timing you get everything you'd normally dig through DevTools for: HTTP protocol (h2, h3, http/1.1), remote IP address, status line, transferred size versus decoded size, Content-Type, Server, Cache-Control, cache status, full request and response headers, and the request body. COPY AS cURL One click copies any request as a complete, runnable curl command — method, headers, and body included, correctly quoted. Paste it into a terminal, hand it to a teammate, or drop it in a bug report. Reproducing an API call stops being a chore. RESEND ANY REQUEST Replay any captured call with one click and see the new status and latency appear right on the button, color-coded. Because the replay runs from the extension's background worker rather than the page, it isn't blocked by CORS — and it flows back through the same measurement pipeline, so it gets timed and rated like any other request. Perfect for checking whether that slow call was a one-off or a real pattern. PER-DOMAIN ANALYSIS A second tab aggregates every domain the page talked to: request count, average latency, worst latency, failure count, and a good/average/poor ratio bar. Sorted slowest-first, so your problem services float straight to the top. When a page feels slow, this view usually names the culprit immediately. AUTOMATIC RESET ON EVERY PAGE LOAD Data is scoped per tab, and each tab's data is wiped automatically when it reloads or navigates to a new URL. The numbers you're looking at always describe the page in front of you — never a stale mix of everything you've browsed today. Other tabs keep their own separate data, so measuring one page never destroys what you're collecting in another. FLOATING OVERLAY THAT STAYS OPEN Chrome closes extension popups the moment you click away, which makes them useless for watching traffic while you actually use your app. So there's a floating overlay panel you can drop straight onto the page (button in the header, or Alt+Shift+L): • A real transparency slider from 20% to 100% — you genuinely see the page through it • Click-through mode, so clicks pass to the page underneath and the panel can hover over your app without getting in the way • Drag it anywhere; it remembers its position, opacity, and open state across page loads • Live stats, the request feed, phase strips, and copy-as-cURL, all without leaving your app DETACHED POP-OUT WINDOW Prefer a separate window? One click pops the full interface out into its own window that stays open while you click anywhere else, and follows whichever tab you're currently working in. FILTER AND SEARCH Filter the request feed by URL or domain text, or narrow it to just the poor calls, just the failures, or any other rating. Cut through a noisy page in seconds. TYPICAL USES • Find out which API endpoint is making your app feel sluggish • Prove whether a slowdown is backend processing (TTFB) or network overhead (DNS/TLS) • C…