Skip to main content
When Limelight is installed on both your client and server, it automatically links outgoing client requests to their corresponding incoming server requests — giving you a unified view of the entire request lifecycle.

​
How It Works

  1. Client sends a request — The client SDK attaches an x-limelight-trace-id header to every outgoing fetch and XHR request
  2. Server receives the request — The server middleware reads the trace ID from the header and associates the incoming request with the same trace
  3. Limelight correlates both sides — In the UI, the client request and server request are grouped under the same trace, so you can inspect both in one place
This happens automatically with no extra configuration.

​
What You Can See

With full-stack tracing enabled, each traced request shows: Client side:
  • Outgoing request URL, method, headers, and body
  • Response status, headers, body, and timing
  • Which React component initiated the request
Server side:
  • Incoming request URL, method, headers, and parsed body
  • Response status, headers, body, and duration
  • Server-side processing time
Combined:
  • Total round-trip time (client send → server process → client receive)
  • Network latency vs. server processing time
  • Matched request/response pairs under a single trace ID

​
Setup

​
1. Client SDK

Add Limelight to your React Native or React app: 
import { Limelight } from "@getlimelight/sdk";

Limelight.connect();

​
2. Server Middleware

Add Limelight to your server. Choose the integration that fits your stack: 
import express from "express";
import { Limelight } from "@getlimelight/sdk";

Limelight.connect({ platform: "node" });

const app = express();
app.use(express.json());
app.use(Limelight.middleware());
That’s it — no additional configuration needed. The client and server SDKs coordinate automatically through the trace header.

​
Custom Trace Header

By default, Limelight uses x-limelight-trace-id as the trace header. If this conflicts with existing headers in your infrastructure, you can customize the name on both sides: 
// Client
Limelight.connect({
  traceHeaderName: "x-my-trace-id",
});

// Server
Limelight.connect({
  platform: "node",
  traceHeaderName: "x-my-trace-id",
});
Both sides must use the same header name for tracing to work.

​
Client-Only or Server-Only

You don’t need both sides. Limelight works independently on either:
  • Client only — See all outgoing requests, console logs, renders, and state
  • Server only — See all incoming requests and responses with timing
  • Both — Everything above, plus automatic full-stack trace correlation