Open Source • In Development

Data That
Feels Local

Sync engine for React and React Native. Type-safe models with automatic reactivity. No loading states required.

# v1.1 coming Q1 2026 - Read the docs to learn more
pnpm add @gluonic/client @gluonic/server

# Get started at docs.gluonic.dev ✨

Unbreakable Connections

Like gluons binding quarks, Gluonic keeps your data perfectly synchronized—across devices, networks, and platforms.

Always Synchronized

Optimistic updates with automatic conflict resolution keep your data in sync across all devices.

Local-First Architecture

Data stored locally for instant access. Syncs in background when connected.

Cross-Platform

Same API for React Native and Web. Write once, sync everywhere.

What Makes Gluonic Different

Built for React developers who want synchronous data access without sacrificing real-time sync.

Synchronous Data Access

Access data synchronously - no async waterfalls, no loading states. Data feels instant.

Type-Safe Models

Define models with TypeScript decorators. Full type inference and autocomplete everywhere.

React & React Native

First-class support for both platforms. Same API, same experience, write once.

Automatic Reactivity

MobX-powered reactivity. Components re-render automatically when data changes.

Real-Time Sync

WebSocket-based real-time updates. See changes from other devices instantly.

Self-Hostable

Your data, your infrastructure. Deploy anywhere Node.js runs. No vendor lock-in.

Simple, Powerful API

Get started with just a few lines of code. No complex configuration required.

client.ts
import { Model, ClientModel, Property, OneToMany, Collection } from '@gluonic/client'
import { observer, useModel } from '@gluonic/client'
import { Suspense } from 'react'

// Define models
@ClientModel('project')
class Project extends Model {
  @OneToMany('task', 'project')
  tasks = new Collection<Task>()
}

// Wrap in Suspense - data guaranteed loaded
<Suspense fallback={<Loading />}>
  <TaskList projectId={id} />
</Suspense>

const TaskList = observer(({ projectId }) => {
  const project = useModel('project', projectId)!
  const tasks = project.tasks.suspense
  return tasks.map(t  => <div>{t.title}</div>)
})

// Tasks guaranteed loaded - no checks needed! ✨

Why Choose Gluonic?

How Gluonic compares to other sync solutions.

Feature
Gluonic
Others
React Native Support
First-class
Experimental/Add-on
Data Access Pattern
Synchronous
Async/Promise-based
Type Safety
Decorators + Inference
Code generation
Reactivity
Automatic (MobX)
Manual subscriptions
Self-Hostable
Limited/Cloud-only
Open Source
Apache 2.0
Varies

Comprehensive Documentation

Everything you need to build production-ready offline-first applications.

1. Setup Sync Server

Create a sync server with your database and authentication.

SyncServer({ ... })
2. Define Your Models

Type-safe models with decorators. Automatic reactivity built-in.

@ClientModel('task')
3. Setup Sync Client

Connect to your server with local storage. Access data with hooks.

SyncClient({ ... })
4. That's It!

Your app now has offline support, real-time sync, and optimistic updates.

Read Full Tutorial →