← back to work

Personal project, 2025

XRAY

A browser extension for the moment after you click a request.

XRAY captures fetch and XHR traffic, shows the decrypted response, and turns the selected request into console context, exports and test assets. It runs as a DevTools panel, a floating HUD or a pop-out window, and loads nothing remote.

Source →

The XRAY API inspector with ten captured requests, one error and two slow ones flagged, and the decrypted JSON of the selected request

The request becomes the console's context.

Select a request and res, req and headers are ready in a console that feels like DevTools, with schema, table and diff helpers.

The XRAY console after running Object.keys(res), schema(res) and res against the selected request

Slow and failing calls, found for you.

Insights flags errors and slow requests from the captured traffic and lists the slowest endpoints and the status mix, all computed locally.

The Insights view with an HTTP error and two slow requests flagged, the slowest requests and the status mix

Under the hood

Response views that are not just JSON.

Tree, raw, grid, schema, diff, visualize, waterfall and headers, each on the selected response.

Exports you would otherwise write by hand.

cURL, fetch and axios calls, a TypeScript type, a Zod schema, a mock, a Jest test or an MSW handler from one request; JSON, CSV or HAR for the whole session.

Long lists stay fast.

Request and console streams are virtualised with TanStack Virtual, so a busy page does not slow the panel.

Output is text, never HTML.

Responses render as text with bounded serialisation, never as markup, and console commands stop after a timeout.

Details

Built with
TypeScript, React, Vite, TanStack Virtual, Manifest V3
When
2025
Links
Source