@multiplayer-app/session-debugger

Multiplayer Session Debugger

The Multiplayer Session Debugger is a powerful tool that offers deep session replays with insights spanning frontend screens, platform traces, metrics, and logs. It helps your team pinpoint and resolve bugs faster by providing a complete picture of your backend system architecture. No more wasted hours combing through APM data; the Multiplayer Session Debugger does it all in one place.

Key Features

• Reduced Inefficiencies: Effortlessly capture the exact steps to reproduce an issue along with backend data in one click. No more hunting through scattered documentation, APM data, logs, or traces.
• Faster Cross-Team Alignment: Engineers can share session links containing all relevant information, eliminating the need for long tickets or clarifying issues through back-and-forth communication.
• Uninterrupted Deep Work: All system information—from architecture diagrams to API designs—is consolidated in one place. Minimize context switching and stay focused on what matters.

Getting Started

Installation

You can install the Multiplayer Session Debugger using npm or yarn:

npm install @multiplayer-app/session-debugger
# or
yarn add @multiplayer-app/session-debugger

Basic Setup

To initialize the Multiplayer Session Debugger in your application, follow the steps below.

Import the Debugger

import debuggerInstance from "@multiplayer-app/session-debugger";

Initialization

Use the following code to initialize the debugger with your application details:

debuggerInstance.init({
  version: "{YOUR_APPLICATION_VERSION}",
  application: "{YOUR_APPLICATION_NAME}",
  environment: "{YOUR_APPLICATION_ENVIRONMENT}",
  apiKey: "{YOUR_API_KEY}",
});

Replace the placeholders with your application’s version, name, environment, and API key (OpenTelemetry Frontend Token).

Add User Metadata

To track user-specific metadata in session replays, add the following:

window["mpSessionDebuggerMetadata"] = {
  userId: "{userId}",
  userName: "{userName}",
};

Replace the placeholders with the actual user information (e.g., user ID and username).

Dependencies

This library relies on the following packages:

• rrweb: Provides the frontend session replay functionality, recording the user’s interactions with the app.
• OpenTelemetry: Used to capture backend traces, metrics, and logs that integrate seamlessly with the session replays for comprehensive debugging.

Example Usage

import debuggerInstance from "@multiplayer-app/session-debugger";

debuggerInstance.init({
  version: "1.0.0",
  application: "MyApp",
  environment: "production",
  apiKey: "your-api-key",
});

window["mpSessionDebuggerMetadata"] = {
  userId: "12345",
  userName: "John Doe",
};

Documentation

For more details on how the Multiplayer Session Debugger integrates with your backend architecture and system auto-documentation, check out our official documentation.

License

This library is distributed under the MIT License.