Syncpad | Portfolio

Syncpad

Real-time collaborative markdown editor with vim keybindings and offline support

ReactTypeScriptYjsCodeMirror 6Cloudflare WorkersDurable ObjectsIndexedDB

The Problem

Google Docs is bloated for technical writing. Notion is slow. HackMD lacks offline support. I wanted a fast, minimal editor that syncs across devices and works offline.

The Approach

Built with CRDTs (Yjs) for conflict-free real-time sync. Service worker enables full offline functionality. Vim mode for power users. Markdown preview with syntax highlighting for code blocks.

The Impact

My daily driver for notes and documentation. 99.9% uptime over 6 months. Sub-100ms sync latency globally thanks to edge deployment.

Build Notes

CRDT Magic

Yjs handles the hard parts of real-time sync:

const ydoc = new Y.Doc();
const ytext = ydoc.getText("content");

// Changes sync automatically
ytext.observe((event) => {
  updateEditor(event.changes);
});

// Works offline, syncs when back online
const provider = new WebrtcProvider("room", ydoc);

Offline-First Architecture

All writes go to IndexedDB first
Service worker intercepts network requests
Background sync when connection restored
Conflict resolution handled by CRDT