{
  "id": "stack-profile:real-time-collaboration",
  "_kind": "StackProfile",
  "_file": "domain/stack-profiles/deep-stacks-2.yaml",
  "_cluster": "domain",
  "attributes": {
    "displayName": "Real-Time Collaboration (WebSocket + CRDT + React + PostgreSQL)",
    "description": "An architecture for building collaborative editing and real-time shared\nstate applications. WebSocket connections provide bidirectional\ncommunication between clients and server, CRDT libraries like Yjs handle\nconflict-free merging of concurrent edits, React renders the live UI,\nPostgreSQL persists document state, and Redis serves as the pub/sub\nbackbone for broadcasting changes across server instances.\n\nThe key design challenge is reconciling optimistic local edits with\nremote changes without user-visible conflicts. Yjs provides a mature\nCRDT implementation that handles text, JSON, and array types with\nautomatic conflict resolution. The server acts as both relay and\npersistence layer, storing periodic snapshots and incremental updates.\nThis stack powers document editors, collaborative whiteboards, shared\nspreadsheets, and multiplayer design tools. The primary tradeoff is\nincreased complexity in state management and debugging compared to\nrequest-response architectures.\n",
    "composes": [
      "library:socket-io",
      "framework:react",
      "language:typescript",
      "language:sql",
      "library:redis",
      "library:express",
      "library:prisma",
      "library:zustand"
    ]
  },
  "outgoingEdges": [
    {
      "from": "stack-profile:real-time-collaboration",
      "to": "library:socket-io",
      "kind": "composed_of"
    },
    {
      "from": "stack-profile:real-time-collaboration",
      "to": "framework:react",
      "kind": "composed_of"
    },
    {
      "from": "stack-profile:real-time-collaboration",
      "to": "language:typescript",
      "kind": "composed_of"
    },
    {
      "from": "stack-profile:real-time-collaboration",
      "to": "language:sql",
      "kind": "composed_of"
    },
    {
      "from": "stack-profile:real-time-collaboration",
      "to": "library:redis",
      "kind": "composed_of"
    },
    {
      "from": "stack-profile:real-time-collaboration",
      "to": "library:express",
      "kind": "composed_of"
    },
    {
      "from": "stack-profile:real-time-collaboration",
      "to": "library:prisma",
      "kind": "composed_of"
    },
    {
      "from": "stack-profile:real-time-collaboration",
      "to": "library:zustand",
      "kind": "composed_of"
    },
    {
      "from": "stack-profile:real-time-collaboration",
      "to": "role:fullstack-engineer",
      "kind": "used_by_role"
    },
    {
      "from": "stack-profile:real-time-collaboration",
      "to": "role:frontend-engineer",
      "kind": "used_by_role"
    },
    {
      "from": "stack-profile:real-time-collaboration",
      "to": "role:backend-engineer",
      "kind": "used_by_role"
    },
    {
      "from": "stack-profile:real-time-collaboration",
      "to": "workflow:feature-development",
      "kind": "follows_workflow"
    },
    {
      "from": "stack-profile:real-time-collaboration",
      "to": "workflow:load-testing-cycle",
      "kind": "follows_workflow"
    },
    {
      "from": "stack-profile:real-time-collaboration",
      "to": "domain:software-engineering",
      "kind": "applies_to"
    },
    {
      "from": "stack-profile:real-time-collaboration",
      "to": "domain:content-operations",
      "kind": "applies_to"
    },
    {
      "from": "stack-profile:real-time-collaboration",
      "to": "skill-area:websocket-design",
      "kind": "requires_skill_area"
    },
    {
      "from": "stack-profile:real-time-collaboration",
      "to": "skill-area:streaming-realtime-processing",
      "kind": "requires_skill_area"
    },
    {
      "from": "stack-profile:real-time-collaboration",
      "to": "skill-area:application-state-management",
      "kind": "requires_skill_area"
    },
    {
      "from": "stack-profile:real-time-collaboration",
      "to": "skill-area:concurrency-multithreading",
      "kind": "requires_skill_area"
    },
    {
      "from": "stack-profile:real-time-collaboration",
      "to": "skill-area:react-state-management",
      "kind": "requires_skill_area"
    }
  ],
  "incomingEdges": []
}