Buoy Desktop Documentation

repository·main·Indexed 21 days ago

https://github.com/buoy-gg/buoy-desktop

A desktop-based dashboard for inspecting and controlling live React Native and Flutter applications. It mirrors devtools from the device to a desktop interface, providing visibility into network, state, and performance through 15 tools across Inspect, State, App, and Capture groups. Features include a Live Performance HUD, remote actions for state management (React Query, Redux, Zustand, Jotai), and a screenshot tool for the iOS Simulator.

Tokens
738
Snippets
1
Records
3
Agent score
25%

What's inside Buoy Desktop

  1. Overview of Buoy Desktop tools and capabilities

    main

    Buoy Desktop provides 15 tools organized into four functional groups to inspect and control your running application:

    • Inspect: Network, Storage, Events, Console.
    • State: React Query, Redux, Zustand, Jotai.
    • App: Routes, Env, Impersonate, Renders.
    • Capture: Bench, Screenshot.

    Key Features

    • Live Performance HUD: Streams UI FPS, JS FPS, CPU, and memory. It automatically detects the device's refresh rate (60, 90, or 120Hz) for accurate FPS monitoring.
    • Remote Actions: Allows you to interact with the app state, including:
      • Edit storage: Live proxying of AsyncStorage, MMKV, and SecureStore.
      • Drive React Query: Refetch, invalidate, and reset queries.
      • Zustand time travel: Jump to past states or reset via setState forwarding.
      • Navigate: Jump to routes, pop-to-index, or pop-to-top.
    • Screenshot Tool: Captures the iOS Simulator.
      • Component mode (default): Provide a testID, nativeID, or component name to auto-crop a specific element.
      • Region mode: Manual rectangle drag.
    • Diagnostics: A console for monitoring device connections, handshakes, and protocol mismatches.
  2. Pricing and Pro features for Buoy Desktop

    main

    Buoy Desktop follows a freemium model:

    • Free Tier: Includes downloading, connecting, and live streaming of all tools.
    • Pro Tier: Unlocks full history and unlimited captures. It also includes access to the MCP server for AI agents.
      • Cost: $29/seat/month or $290/year (includes a 14-day trial).
      • Activation: Paste a license key into the navbar License button or connect a device that already has an active license.
    • Weekend Pass: All Pro features are unlocked for free every Saturday and Sunday (indicated by a violet badge in the navbar).
  3. Install and connect Buoy Desktop

    main

    Buoy Desktop is a free desktop dashboard that mirrors Buoy devtools from your React Native or Flutter app.

    Installation

    1. Download the platform-specific zip (macOS, Windows, or Linux) from the latest releases.
    2. Unzip and launch the application.
    3. The app starts a local broker on port 42831 and attempts to auto-detect devices.

    Note: Your app must have Buoy devtools installed to connect.

    Connection Methods

    Connection is typically automatic by deriving the broker address from the Metro dev server. Use the following guide for specific setups:

    SetupConnection Action
    Simulator, emulator, or physical device on same Wi-FiAutomatic (no configuration required)
    Android over USBRun adb reverse tcp:42831 tcp:42831
    Expo tunnel modeProvide an explicit socketURL via the externalSync prop using http://<your-computer-ip>:42831
    # For Android over USB connection
    abd reverse tcp:42831 tcp:42831