A developer tool for inspecting Loro document state and history.
Try it out at inspector.loro.dev.
demo.mp4
Loro Inspector is a web-based tool that allows you to examine the internal state of Loro CRDT documents. With it, you can:
- View the current document state
- Explore document history
- Visualize the Directed Acyclic Graph (DAG) of changes
- Navigate through time to see how the document evolved
- File Import: Analyze Loro document files by drag-and-drop
- Text Import: Import documents from pasted text content (base64, JSON, or plain text)
- Document State View: Inspect the current state of your Loro document
- History Timeline: Navigate through the document's history
- DAG Visualization: View the directed acyclic graph of document changes
-
Clone the repository
git clone https://github.com/loro-dev/loro-inspector.git
-
Install dependencies
cd loro-inspector pnpm install
-
Start the development server
pnpm dev
-
Open your browser and navigate to
http://localhost:5173
-
Import a Loro document using one of these methods:
- File Upload: Drag and drop a Loro document file onto the dropzone
- Text Import: Switch to "Text Import" tab and paste:
- Base64 encoded Loro updates/snapshots
- JSON updates from
doc.exportJsonUpdates(...)
- Example: Click "Try Example Document" to load the included sample
-
Use the tabs to switch between different views:
- State: View the current document state
- History: Explore the document's edit history
- DAG: Visualize the document's change graph
-
In the State view, use the timeline slider to navigate through different versions of the document.
Contributions are welcome! Please feel free to submit a Pull Request.
This project is licensed under the MIT License - see the LICENSE file for details.