Real-time Collaborative Cursors

Real-time Collaborative Cursors

Example project demonstrating real-time cursor tracking and collaborative canvas.

Features

  • Real-time cursor tracking: Broadcast cursor positions to all connected users instantly
  • Event-driven architecture: Use actor events to push updates to WebSocket clients
  • Persistent canvas state: Text labels automatically saved in actor state across sessions
  • Multiple rooms: Each room is a separate actor instance with isolated state

Implementation

This example demonstrates real-time collaboration using WebSockets and Rivet Actors:

  • Actor Definition (src/backend/registry.ts): Implements the canvasRoom actor for tracking cursor positions and managing collaborative canvas state

Resources

Read more about WebSockets, state, and events.