> ## Documentation Index
> Fetch the complete documentation index at: https://docs.getlimelight.io/llms.txt
> Use this file to discover all available pages before exploring further.

# Introduction

> The runtime context layer for AI-assisted development. Limelight captures what happens when your code runs and makes it queryable by AI.

# Welcome to Limelight

Limelight is the **runtime context layer** for AI-assisted development. It captures everything that happens when your app runs — network requests, state changes, re-renders, console logs, timing, and errors — and makes it machine-queryable through structured, pre-analyzed context called **Debug IR**.

AI coding assistants can read your source code, but they can't see what actually happens at runtime. Limelight bridges that gap.

## Why Limelight?

* **Runtime Context for AI** — Your AI assistant debugs with real runtime data, not guesses. Ask *"why is my search showing stale results?"* and get an answer backed by actual causal chains.
* **Zero Config Setup** — One line of code. No rebuilds, no heavy instrumentation.
* **Full-Stack Correlation** — Automatically links frontend requests to backend responses to state updates to re-renders across system boundaries.
* **Causal Analysis** — Limelight doesn't just capture events. It correlates them into causal chains, detects anti-patterns (N+1 queries, render loops, race conditions), and delivers pre-analyzed context.
* **Privacy-First** — All data stays on your machine. No telemetry, no cloud dependency.
* **Two Surfaces, One Engine** — Use the Desktop App for visual debugging or the MCP Server to pipe runtime context directly into Cursor, Claude Code, or any MCP-compatible editor.

## Key Features

<CardGroup cols={2}>
  <Card title="MCP Server" icon="robot" href="/mcp/installation">
    Pipe live runtime context into your AI coding assistant. Your AI calls
    Limelight's tools automatically to diagnose issues with real data.
  </Card>

  <Card title="Full-Stack Tracing" icon="link" href="/features/full-stack-tracing">
    Automatically correlate client requests with server handling. See the full
    request lifecycle from browser to server and back.
  </Card>

  <Card title="Render Tracking" icon="bolt" href="/features/render-tracking">
    Component renders are captured, scored, and analyzed. Detect render loops,
    unnecessary re-renders, and unstable props automatically.
  </Card>

  <Card title="Network Inspection" icon="network-wired" href="/features/network-requests">
    Every request and response with timing, status, headers, bodies, and GraphQL
    intelligence including complexity scoring.
  </Card>

  <Card title="State Debugging" icon="database" href="/features/state">
    Zustand and Redux store contents, diffs, and change history. See exactly how
    state evolved and what triggered each change.
  </Card>

  <Card title="Issue Detection" icon="magnifying-glass" href="/features/issue-detection">
    Automatic detection of N+1 queries, render cascades, race conditions, retry
    storms, stale closures, and other runtime anti-patterns.
  </Card>
</CardGroup>

## Two Ways to Use Limelight

### MCP Server — AI-Powered Debugging

Give your AI coding assistant direct access to your app's runtime. The MCP server streams live data from your running app and exposes 11 debugging tools that your AI calls automatically.

Works with **Cursor**, **Claude Code**, **Windsurf**, and any MCP-compatible editor.

```bash theme={null}
# One command to set up
claude mcp add limelight-mcp npx limelight-mcp
```

### Desktop App — Visual Debugging

Free, local-first visual debugger with an interactive timeline, real-time updates, and built-in AI analysis.

<CardGroup cols={1}>
  <Card title="Download for macOS" icon="apple" href="https://www.getlimelight.io/download">
    No account required. All data stays on your machine.
  </Card>
</CardGroup>

## Supported Platforms

| Platform          | Status    |
| ----------------- | --------- |
| React Native      | Supported |
| React (web)       | Supported |
| Next.js           | Supported |
| Node.js / Express | Supported |
| Expo              | Supported |

## Open Source

Limelight's SDK is fully open source and available on [GitHub](https://github.com/getlimelight/limelight-sdk).

## Next Steps

<CardGroup cols={2}>
  <Card title="Quick Start" icon="rocket" href="/quickstart">
    Get Limelight running in your app in under 5 minutes.
  </Card>

  <Card title="MCP Server Setup" icon="robot" href="/mcp/installation">
    Connect your AI coding assistant to your running app.
  </Card>

  <Card title="How It Works" icon="gears" href="/how-it-works">
    Understand the architecture — SDK, correlation engine, and Debug IR.
  </Card>

  <Card title="Concepts" icon="lightbulb" href="/concepts">
    Learn about Debug IR, causal chains, and the correlation engine.
  </Card>
</CardGroup>