skills.rest
skeletorflet
skeletorfletCOMMUNITY
Explore all skills by this author →
GitHub

realtime-collaborative

Synchronize client state with CRDTs over WebSocket and WebRTC channels.

7|1|Updated Mar 28, 2026
Search Tags:#collaboration#real-time#presence#sync#websocket#webrtc#crdt
One-click install
npx skills add https://github.com/skeletorflet/opencode-kit --skill realtime-collaborative
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: realtime-collaborative
Source: https://github.com/skeletorflet/opencode-kit/tree/main/.opencode/skills/realtime-collaborative
Command: npx skills add https://github.com/skeletorflet/opencode-kit --skill realtime-collaborative

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Building multi-user apps requires instant, conflict-free state synchronization across clients, delivering smooth collaboration experiences.

Core Features & Use Cases

  • CRDT-based state synchronization to prevent merge conflicts in collaborative editors.
  • Presence and awareness to show active users and cursors in real-time.
  • WebSocket and WebRTC signaling to broadcast updates and coordinate peers.

Quick Start

Add real-time collaboration to your app by enabling CRDT-based synchronization across clients.

Frequently Asked Questions about realtime-collaborative

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I add real-time collaboration to an app with conflict-free state synchronization?▼

Real-time collaboration is enabled by synchronizing state across clients using CRDT-based data structures over WebSocket or WebRTC channels. This approach ensures instantaneous state convergence and prevents merge conflicts in multi-user interfaces.

What is CRDT-based synchronization and when do I need it for multi-user apps?▼

CRDT-based synchronization uses conflict-free replicated data structures to automatically resolve concurrent edits without server-side conflict resolution. It is needed for live document editors and dashboards where multiple users modify shared state simultaneously.

How do I show active user presence and cursors in a collaborative editor?▼

Active user presence and cursor tracking are implemented through awareness channels that broadcast user state updates via WebSocket signaling. This allows multi-user interfaces to display real-time participant locations and activity.

Does real-time sync work with both WebSocket and WebRTC channels?▼

Yes, real-time sync supports both WebSocket and WebRTC signaling to broadcast updates and coordinate peers. WebSocket provides centralized signaling, while WebRTC enables direct peer-to-peer connections for client state convergence.

What's the best way to prevent merge conflicts in live collaborative editors?▼

The best way to prevent merge conflicts is using CRDT-based data structures for deterministic synchronization. This ensures all clients converge to the same state automatically without requiring custom conflict resolution logic.

Can I use this real-time sync approach for dashboards and multi-user interfaces?▼

Yes, the deterministic synchronization patterns support live dashboards and multi-user interfaces requiring instantaneous state convergence. The CRDT integration and presence awareness adapt to any application needing real-time state updates.

Related Skills

Explore More Software Engineering Skills→
TitusLee2000TitusLee2000

phone-client-build

Build a mobile WebRTC camera client streaming video to a dashboard.

Community
Advanced
jonathanbelolojonathanbelolo
3

composable-svelte-chat

Implement streaming chat with presence tracking for Composable Svelte apps.

Community
Advanced
curiositechcuriositech
181

real-time-collaboration-engine

Implement WebSocket communication with OT/CRDT conflict resolution and presence awareness.

Official
Advanced
ricablericable
1

ruvector-economy-wasm

Implement a CRDT-based credit economy compiled to WebAssembly for distributed compute networks.

Community
Advanced