← All work

Case study · Paperplane · 2019

Paperplane Collaborative Editor

The real-time editor behind a document tool for small teams, rebuilt so that nobody ever loses a sentence.

Role
Frontend Engineer
Client
Paperplane
Year
2019
Duration
12 months
Team gathered around a table reviewing work on laptops and paper
Weekly editor clinic with support, design and engineering.

01

The problem

Paperplane's editor synced by sending whole-document snapshots. When two people typed at once, the last save won, and the support queue was dominated by one complaint: "my paragraph disappeared."

Remote cursors also lagged by a full second on slower connections, which made co-editing feel like a hazard rather than a feature.

02

The approach

  1. 01

    Adopt a CRDT, not a patch

    I moved the document model to Yjs so concurrent edits merge deterministically, then wrapped it in TipTap for a schema the design team could extend.

  2. 02

    Presence that feels instant

    Cursors and selections travel on a separate lightweight channel, rendered with transforms only, so a remote cursor never triggers layout.

  3. 03

    Offline as a normal state

    Edits persist to IndexedDB and merge on reconnect. A quiet status chip replaces the old blocking 'connection lost' modal.

  4. 04

    Soak testing

    A headless script put 250 simulated editors in a single document overnight, and the results fed straight into the CI pipeline.

Designers pinning printed screens to a wall during a collaborative workshop
Mapping every state an editor can be in, from offline to conflict.

03

The outcome

The new editor shipped to all customers behind a gradual rollout, and the 'disappeared paragraph' ticket category all but vanished.

−92%
lost-edit support tickets
2.1s → 0.7s
time to first keystroke
250
concurrent editors per document, soak-tested

04

The stack

  • TypeScript
  • TipTap
  • Yjs
  • WebSockets
  • IndexedDB
  • Jest
Next project · 2024Tillage Design System

12 results

Made with Supacode