|
| 1 | +export const author = "nathan-flurry" |
| 2 | +export const published = "2025-12-05" |
| 3 | +export const category = "changelog" |
| 4 | +export const keywords = ["inspector", "devtools", "debugging", "actors", "local-development", "visualization"] |
| 5 | + |
| 6 | +# Introducing the New Local Inspector |
| 7 | + |
| 8 | +**Debug, visualize, and interact with your Actors in real-time. The new Rivet Inspector is built with new features and improvements to improve developer velocity.** |
| 9 | + |
| 10 | +Building stateful backends has always had one major friction point: observability. Unlike stateless functions where a request comes in and goes out, Actors maintain memory, handle persistent connections, and evolve over time. `console.log` doesn't cut it when you need to understand the lifecycle of a long-running process. |
| 11 | + |
| 12 | +Today, we are launching the inspector button for the **Rivet Local Inspector**. It’s a dedicated DevTool that runs alongside your Rivetkit project, giving you X-ray vision into your application's state. |
| 13 | + |
| 14 | +## The Problem: State is a Black Box |
| 15 | + |
| 16 | +When developing with Rivet Actors, your data lives in memory. This provides incredible performance, but it also means you can't just query a database to see "what happened." You need to know: |
| 17 | + |
| 18 | +- What is the exact state of this Actor *right now*? |
| 19 | +- Who is connected via WebSocket? |
| 20 | +- Why did that state transition happen? |
| 21 | + |
| 22 | +Previously, answering these questions required writing custom debug actions or sifting through verbose logs. |
| 23 | + |
| 24 | +## The Solution: A Visual DevTool for Your Backend |
| 25 | + |
| 26 | +The new Local Inspector treats your backend like a frontend. It connects directly to your local Rivet runtime and visualizes the topology of your Actors. |
| 27 | + |
| 28 | +### 1. Live State Editing |
| 29 | + |
| 30 | +You can now view and **mutate** your Actor's state directly from the UI. Need to test how your game logic handles a specific edge case? Just edit the JSON state, and the Actor updates instantly—no restart required. |
| 31 | + |
| 32 | +### 2. Event Timeline & Time Travel |
| 33 | + |
| 34 | +Debugging race conditions is now trivial. The Event Timeline records every Action, Event, and State Change. You can scrub through history to see exactly how an Actor arrived at its current state. |
| 35 | + |
| 36 | +- **Filter by Source:** Isolate events from specific user IDs or connection types. |
| 37 | +- **Diff View:** See exactly which properties changed between ticks. |
| 38 | + |
| 39 | +### 3. Integrated REPL |
| 40 | + |
| 41 | +The Inspector now includes a context-aware REPL. You can invoke Actions directly from the browser without needing to curl an endpoint or trigger a client-side event. |
| 42 | + |
| 43 | +```typescript |
| 44 | +// Call actions directly from the Inspector console |
| 45 | +> chatRoom.connect("user_123") |
| 46 | +> chatRoom.call("sendMessage", { text: "Hello from Inspector!" }) |
| 47 | +< Action dispatched: "sendMessage" |
| 48 | +< State updated: messages.length is now 42 |
| 49 | +``` |
| 50 | + |
| 51 | +### 4. Connection Topology |
| 52 | + |
| 53 | +Visualize your WebSocket connections in real-time. See which clients are connected to which Actors, monitor latency, and force-disconnect clients to test reconnection logic. |
| 54 | + |
| 55 | +## Zero-Config Setup |
| 56 | + |
| 57 | +The best part? If you are running the latest version of `rivetkit`, you already have it. The Inspector automatically detects your local dev server. |
| 58 | + |
| 59 | +Just start your project: |
| 60 | + |
| 61 | +```bash |
| 62 | +npx rivet dev |
| 63 | +``` |
| 64 | + |
| 65 | +And open the dashboard: |
| 66 | + |
| 67 | +`http://localhost:6420/_inspector` |
| 68 | + |
| 69 | +## Available Now |
| 70 | + |
| 71 | +The new Local Inspector is available in **Rivet v2.1.0**. |
| 72 | + |
| 73 | +- **Get Started:** Update your packages via `npm install rivetkit@latest`. |
| 74 | +- **Documentation:** Read the full [Inspector Documentation](https://rivet.dev/docs/inspector). |
| 75 | +- **Feedback:** Join us on [Discord](https://discord.gg/rivet) to share your thoughts. |
| 76 | + |
0 commit comments