flightrec
Introducing Flightrec

Debugging,
rewound.

Stop guessing what went wrong. Rewind your Next.js session and inspect every state change — with absolute clarity.

Read the docs ›
localhost:3000 / session-9281
Session Timeline
Server Action
0ms – 42ms
RSC Payload
42ms – 115ms
Client Patch
115ms – 148ms
actions.ts
network.log
react-tree.tsx
1export async function createPost(form: FormData) {
2 const title = form.get('title')
3 const post = await db.post.create({ title })
4 updateTag('posts')
5 redirect(`/posts/${post.id}`)
6}
8→ created post #42
9→ invalidated 'posts' tag
cache updateTag('posts') immediate-freshness ✓route /posts/42total 148ms
scroll to replay ↓
The problem

App Router apps are hard to debug because the story is scattered.

01

State spans the boundary

Some state lives on the server, some on the client. One interaction means reasoning across two execution models at once.

02

Rendering is streamed

RSC payloads arrive in chunks over time. The UI at tick 8 isn't the UI at tick 11 — and nothing shows you the difference.

03

Cache behavior is invisible

updateTag and revalidateTag imply different freshness. Whether the user actually saw fresh data is never surfaced.

04

No tool unifies the layers

Logs, traces, metrics, and firewall rules each see one slice. None replay the causal chain end to end.

The wedge

One debugger, six planes, one timeline.

Observability shows one slice. Runtime metadata shows another. Flightrec unifies all six planes against a single scrubber — the difference versus traces, metrics, or generic session replay.

01User actionUSER
02Server ActionACTION
03Cache invalidationCACHE
04RSC payloadRSC
05Response mutationNET
06Client treeTREE
What you'll catch

The bugs that don't show up in logs.

App Router failures hide between layers. Flightrec puts the whole causal chain on one timeline, so the root cause is where you'd expect it.

Cache

The dashboard that stayed stale

An edit flow used the wrong invalidation. Flightrec shows updateTag fired but no tracked node changed — an orphaned invalidation, not the read-your-own-writes you intended.

Auth

The sign-in that lost the cookie

A redirect through nested layouts left auth half-applied. The timeline lines up the cookie write, the 303, and the tree reconcile so the partial-stale state is obvious.

Actions

The mutation that ran twice

A double-submit fired the Server Action twice. Two invocations sit side by side on the timeline with their args and outcomes — no more guessing from logs.

How it works

Capture both sides. Normalize. Replay deterministically.

Server and client-side capture feed a normalizer, which persists locally and replays in the inspector. No shadow React runtime — a deterministic replay graph. MCP enriches; it's never the source of truth.

01User interaction
02Server + client capture
03Trace normalizer
04Reconciler + checkpoints
05IndexedDB / .frec
06Inspector replay
instrumentation.tsone-line setup · dev only
export function register() {
  // captures Server Actions, cache, RSC, headers
  registerFlightrec({ mode: 'normal' })
}
export a sessionproduce a shareable .frec bundle
const bundle = await session.export()
// → ses_8f31a0.frec  (zip + manifest + diffs)
await bundle.download()
Performance

Light enough to run always-on.

A debugger you can't afford to run is a demo, not a tool. Flightrec's normal mode targets a bounded, dev-only overhead envelope — benchmarked the way OpenTelemetry recommends.

Capture overhead · p95 latency vs baselineillustrative · 100 RPS
Flightrec · minimal
local capture
1.04× (+4%)
Vercel Observability
sampled, platform
1.05× (+5%)
Flightrec · normal
realistic dev
1.09× (+9%)
OpenTelemetry
tracing baseline
1.12× (+12%)
Sentry Replay
DOM recording
1.18× (+18%)
React DevTools
profiler on
1.30× (+30%)
Replay.io
full recording
1.62× (+62%)
Capture modes
minimal · normal · verbose
Prod cost
no-op import
SDK size
~18 KB gzipped
Bundle / session
diffed snapshots

Representative targets, not measured results — validated by the Phase-4 benchmark harness. Cross-tool numbers are directional; each tool records a different surface.

Positioning

Adjacent tools each see one slice.

Replay.io pioneered time-travel debugging — for client JavaScript. Sentry replays the DOM; Vercel ships traces; Next.js MCP exposes metadata; OpenTelemetry captures spans. None replay causality across Server Actions, cache, RSC, and reconciliation.

Capability
Flightrec
this
Replay.io
client JS
Sentry
DOM replay
Vercel Obs.
traces
Next.js MCP
metadata
OTel
spans
Session-level time-travel replay
Server Action causalitymeta
Cache invalidation semantics
RSC / Flight payload frames
Client tree reconciliation diff
Cookie / header mutation trail
Source-mapped to your code
Works offline from a bundle
Agent-queryable (MCP) traces

● full · ◐ partial · — none. Reflects each tool's primary design intent.

Pricing

Start free. Scale when your team does.

The core SDK, inspector, and trace format are open source and free forever. Pay only for cloud collaboration.

Free
$0forever

For solo debugging, fully local.

Start free
  • Local capture, all six planes
  • .frec export / import
  • Inspector PWA
  • Cache-semantics classifier
  • Community support
GrowthPopular
$299/ month

For teams shipping fast.

Try Flightrec for free
  • Everything in Free
  • Cloud sync + shared trace links
  • 90-day retention
  • Flightrec MCP server
  • AI session summaries & bug reports
  • Priority support
Enterprise
Custom

For orgs at scale.

Contact us
  • SSO / SAML + audit logs
  • Self-host / BYO storage
  • Data residency
  • SLA + dedicated support
  • Security review & DPA

Start free. No credit card required.

Coming soon

Built in the open. Watch it take shape.

The demo above runs on synthetic data today — the recorder, inspector, and MCP server are landing phase by phase.