Skip to content

What is xNet?

Building a modern collaborative app requires assembling a stack of 6+ services: a database, an API layer, auth, real-time sync, file storage, and deployment infrastructure. Each comes with its own SDK, its own data model, and its own failure modes.

Most of this infrastructure exists to solve one problem: getting data from one device to another. xNet eliminates that problem entirely.

xNet is a local-first framework for React. Your data lives on the user’s device. It syncs peer-to-peer via WebRTC. There is no server, no API, no database to manage.

You interact with xNet through three hooks:

HookPurpose
useQueryRead data reactively. Filter, sort, paginate.
useMutateCreate, update, delete with full type safety.
useNodeOpen a single node for collaborative editing with Yjs.

That’s the entire API surface for most apps. Define a schema, use the hooks, and your app works offline, syncs in real-time, and never touches a server.

Your React App
└── useQuery / useMutate / useNode / useCan / useGrants
└── NodeStore (schema-validated, type-safe, encrypted)
├── SQLite (OPFS in browser) / SQLite (desktop/mobile)
├── Authorization engine (PolicyEvaluator + GrantStore)
└── P2P Sync (WebRTC via signaling server)
└── Yjs CRDT (rich text) + Lamport LWW (structured data)

Everything below the hooks is invisible to you. You write React components. xNet handles storage, sync, conflict resolution, cryptographic signing, and end-to-end encryption.

Good fit:

  • Productivity apps (notes, tasks, databases, wikis)
  • Collaborative tools (documents, whiteboards, spreadsheets)
  • Personal tools (journals, habit trackers, budgets)
  • Internal tools where you control the client
  • Apps where data ownership and privacy matter

Not a good fit (yet):

  • Apps that need a centralized server of record (banking, e-commerce)
  • Apps with millions of users sharing a single dataset
  • Apps that need server-side rendering of user data
  • Apps that need complex server-side business logic

xNet is a monorepo of focused packages:

PackagePurpose
@xnetjs/reactReact hooks: useQuery, useMutate, useNode, useCan, useGrants, useSecurity
@xnetjs/dataSchema system, NodeStore, 15 property types, authorization engine
@xnetjs/syncLamport clocks, Change<T> v3 (hybrid signatures), Yjs security
@xnetjs/cryptoBLAKE3, Ed25519, ML-DSA-65, X25519, ML-KEM-768, XChaCha20-Poly1305
@xnetjs/identityDID:key, HybridKeyBundle, PQ Key Registry, UCAN tokens, key recovery
@xnetjs/storageSQLite adapter
@xnetjs/canvasInfinite canvas with spatial indexing
@xnetjs/editorTipTap rich text editor
@xnetjs/devtools9 debug panels + AuthZ panel + Security panel

For most apps, you only install @xnetjs/react and @xnetjs/data. Everything else is pulled in as needed.