Home / Blog / Artikel

Local-First Software Architecture: CRDTs für den Mittelstand

Offline-fähige B2B-Web-Apps mit CRDTs (Conflict-free Replicated Data Types): Architektur, Yjs, Automerge & Leitfaden für den Mittelstand.

💻 WebentwicklungVeröffentlicht am 13. August 2026 | Lesezeit: ca. 13 Minuten | Autor: Pragma-Code Redaktion
Local-First Software Architecture & CRDT Data Nodes

Traditionelle Cloud-First-Anwendungen stoßen bei Netzausfällen im Außendienst, in Werkshallen oder auf Baustellen an ihre Grenzen. Die Local-First-Software-Architektur in Kombination mit CRDTs (Conflict-free Replicated Data Types) bringt die Datenhoheit auf das Endgerät zurück – für ausfallsichere, hochperformante B2B-Web-Apps mit automatischer Hintergrund-Synchronisation.

Teil unserer Themen-Hub-Serie:

Dieser Artikel ist ein vertiefender Fachbeitrag aus unserem Content-Cluster. Entdecken Sie die vollständige Übersicht auf unserer Hauptseite:Webentwicklung & IT-Lösungen

Executive Summary für Entscheidungsträger
  • Ausfallsicherheit im Feld: Cloud-First-Anwendungen versagen bei instabiler Netzwerkabdeckung im Außendienst, in Fertigungshallen oder Untergeschossen. Local-First sichert den unterbrechungsfreien Betrieb.
  • Konfliktfreie Synchronisation: Durch CRDTs (Conflict-free Replicated Data Types) gehören Datenverluste, Server-Blockaden und manuelle Konflikt-Lösungsdialoge ("Last-Write-Wins") der Vergangenheit an.
  • Zukunftssichere Souveränität: Unternehmen kombinieren mit Local-First die Schnelligkeit lokaler Desktop-Anwendungen mit der nahtlosen Kollaboration moderner Cloud-Systeme.

1. Das Paradoxon der Cloud-Abhängigkeit im B2B

In den vergangenen fünfzehn Jahren hat die Cloud-Transformation die europäische Unternehmenslandschaft dominiert. SaaS-Lösungen und zentrale Datenbanken brachten unbestreitbare Vorteile für Wartung, Skalierung und zentrale Administration. Doch in der rauen Praxis des deutschen Mittelstandes zeigt sich zunehmend die Kehrseite dieser totalen Zentralisierung: Die Abhängigkeit von einer permanenten, hochperzentil-stabilen Internetverbindung.

Ob Servicetechniker in Untergeschossen von Industrieanlagen, Vertriebsmitarbeiter im ländlichen Raum, Bautrupps in Funklöchern oder Logistiker im Hochregallager – wenn die Verbindung abreißt, stoppen in klassischen Cloud-First-Architekturen die Geschäftsprozesse. Eingabemasken frieren ein, Lade-Spinner drehen sich endlos, und im schlimmsten Fall gehen ungespeicherte Formularinhalte unwiederbringlich verloren.

Kostenfalle 1: Ausfallzeiten im Außendienst

Wenn Wartungsprotokolle oder Maschinendiagnosen mangels Netzabdeckung nicht erfasst werden können, entstehen teure Leerzeiten und manuelle Doppelarbeiten im Büro.

Kostenfalle 2: Datenverlust durch Last-Write-Wins

Überschreiben zwei Mitarbeiter offline dieselbe Kundenakte, gewinnt bei der Serververbindung meist der spätere Upload – Änderungen des ersten Mitarbeiters werden lautlos gelöscht.

Kostenfalle 3: Latenz-Frust in Kernprozessen

Jeder Klick erfordert einen Server-Roundtrip. Selbst bei funktionierendem 5G verzögert eine Latenz von 200 ms die flüssige Datenbearbeitung spürbar.

Um diese Herausforderungen zu lösen, greifen viele Entwicklerteams zu behelfsmäßigen Offline-Caching-Mechanismen. Doch der Teufel steckt im Detail: Sobald mehrere Anwender dieselben Datensätze offline modifizieren, entstehen beim Wiederverbinden massive Synchronisationskonflikte. Die klassische Local-First Software-Architektur in Kombination mit CRDT (Conflict-free Replicated Data Types) löst dieses Problem nicht durch symptomatische Patches, sondern auf fundamental mathematischer Ebene.

2. Was ist Local-First Software Architecture?

Der Begriff "Local-First" wurde 2019 durch ein wegweisendes Forschungspapier von Ink & Switch geprägt. Er beschreibt ein Architekturparadigma, das die Vorteile lokaler Software (Null Latenz, volle Offline-Verfügbarkeit, Datenkontrolle) mit den Vorteilen von Cloud-Software (Echtzeit-Kollaboration, automatisches Backup, Multi-Device-Sync) vereint.

Anders als bei herkömmlichen "Offline-First"-Ansätzen, bei denen der Browser-Cache lediglich als temporärer Puffer dient und der Server nach wie vor die absolute Autorität ("Single Source of Truth") darstellt, gilt bei Local-First: Die lokale Datenbank auf dem Client ist die primäre Datenquelle.

Vergleich: Cloud-First vs. Local-First Architecture

Cloud-First (Klassisch)
  • Primary Source: Zentrale Server-Datenbank (z. B. PostgreSQL/Oracle)
  • Netzwerkzwang: Jede Aktion erfordert API-Call (REST/GraphQL)
  • Offline-Verhalten: Blockiert oder eingeschränkter Read-Only Puffer
  • Konfliktlösung: Last-Write-Wins (LWW) oder sperrende Locks
  • Latenz: Abhängig von Server-Distanz & Verbindungsqualität
Local-First (Modern mit CRDTs)
  • Primary Source: Lokale Client-Datenbank (IndexedDB / OPFS)
  • Netzwerkzwang: Keiner – Server ist asynchroner Sync-Knoten
  • Offline-Verhalten: 100 % Lese- & Schreibfähigkeit ohne Einschränkung
  • Konfliktlösung: Mathematisch konfliktfreie Zusammenführung via CRDTs
  • Latenz: 0 ms (sofortige UI-Reaktion auf lokale Schreibzugriffe)

Im Zentrum dieser Architektur stehen sieben Kernprinzipien, die moderne B2B-Anwendungen erfüllen müssen:

1. Keine Latenz (No Wait)

Alle Lese- und Schreibzugriffe erfolgen direkt im lokalen Speicher des Endgeräts. Benutzeroberflächen reagieren augenblicklich in 0 Millisekunden.

2. Multi-Device & Offline-Funktionalität

Arbeiten ist an jedem Ort ohne Internetverbindung möglich. Das Endgerät speichert sämtliche Änderungen lokal ab und wartet geduldig auf Netzempfang.

3. Nahtlose Netzwerksynchronisation

Sobald eine Verbindung hergestellt wird, tauschen die Endgeräte ihre lokal aufgelaufenen Änderungs-Delta-Pakete im Hintergrund aus.

4. Kollaboration & Konfliktfreiheit

Mehrere Benutzer können gleichzeitig an denselben Dokumenten oder Datensätzen arbeiten, ohne dass manuelle Konflikt-Dialoge erforderlich werden.

3. Die mathematische Magie der CRDTs

Die größte Hürde bei dezentralen Datenspeichern war historisch das Problem der Nebenläufigkeit. Wenn Techniker A auf Baustelle 1 den Status eines Bauteils auf "Geprüft" setzt und Techniker B zur gleichen Zeit auf Baustelle 2 die Seriennummer desselben Bauteils korrigiert, welcher Zustand ist korrekt?

Klassische Relationale Datenbanken lösen dies mit verteilten Transaktionen und Locking (z. B. Zwei-Phasen-Commit). Dies setzt jedoch voraus, dass alle Beteiligten permanent online sind. Fällt das Netzwerk aus, versagt das Locking.

Hier kommen CRDTs (Conflict-free Replicated Data Types) ins Spiel. Dabei handelt es sich um spezielle Datenstrukturen, die mathematisch garantiert zum selben Endergebnis (Eventual Consistency) konvergieren – völlig unabhängig davon, in welcher Reihenfolge die Änderungen auf den einzelnen Geräten eingehen.

Experten-Tipp: Die zwei Grundarten von CRDTs

Man unterscheidet grundsätzlich zwei mathematische Ansätze:

  • State-based CRDTs (CvRDT): Die Knoten senden ihren gesamten lokalen Zustand an andere Knoten. Die Zusammenführung erfolgt über eine mathematische Join-Semantik (halbgeordnete Menge mit kleinster oberer Schranke).
  • Operation-based CRDTs (CmRDT): Die Knoten senden nur die einzelnen Mutations-Operationen (z. B. "Füge Zeichen X an Position 5 ein"). Voraussetzung ist, dass das Transportnetzwerk die Zustellung aller Operationen ohne Verlust garantiert.

Um zu verstehen, warum CRDTs ohne zentralen Server auskommen, betrachten wir die mathematischen Eigenschaften der Zusammenführungsfunktion (Merge-Operator ):

Durch die Kombination aus Kausalgraphen, Vector Clocks und eindeutigen Client-IDs lassen sich Listen, Textdokumente, JSON-Bäume und Schlüssel-Wert-Speicher mathematisch sauber zusammenführen.

4. Framework-Vergleich: Yjs, Automerge & Electric SQL

Für Softwarearchitekten im Mittelstand stellt sich nicht mehr die Frage, ob CRDTs serienreif sind, sondern welches Open-Source-Framework für das eigene B2B-Projekt die richtige Wahl darstellt. Auf dem Markt haben sich drei maßgebliche Technologien etabliert:

Yjs (High Performance)

In JavaScript geschrieben, extrem speichereffizient und auf maximale Performance optimiert. Der De-Facto-Standard für kollaborative Editoren (ProseMirror, Quill, Monaco, TippTap) und komplexe Formular-Trees.

🌳

Automerge (JSON-Native)

In Rust entwickelt mit JavaScript- & iOS-Bindings. Bietet eine vollwertige Git-ähnliche Historie für beliebige JSON-Datenstrukturen. Ideal für komplexe Datenmodelle mit Zeitreise- & Audit-Anforderungen.

🔌

Electric SQL (Postgres-Sync)

Schließt die Lücke zwischen PostgreSQL im Backend und SQLite/IndexedDB im Frontend. Nutzt Log-basierte Replikation, um SQL-Tabellen automatisch bidirektional in CRDT-Form mit Clients zu synchronisieren.

Nachfolgend finden Sie eine detaillierte Gegenüberstellung der Architektureigenschaften für B2B-Anwendungen:

B2B-Matrix: Yjs vs. Automerge vs. Electric SQL

Eigenschaft
  • Hauptfokus:
  • Speicher-Footprint:
  • Historien-Verwaltung:
  • Backend-Integration:
  • Best for:
  • Echtzeit-Text & Dokumente
  • Extrem gering (~ 1-2 MB RAM)
  • Garbage Collected (Kompakt)
  • Node.js, WebSocket, WebRTC
  • Rich-Text, Diagramme, Canvas
  • Komplexe JSON-Objekte
  • Mittel bis hoch (Rust Core)
  • Vollständige Commit-Historie
  • Rust, Node.js, P2P
  • B2B-CRMs, Konfiguratoren

5. Praxis-Architektur für den mittelständischen Einsatz

Wie sieht eine praxiserprobte Local-First-Enterprise-Architektur in der Praxis aus? Bei Pragma-Code setzen wir auf eine bewährte 3-Schichten-Architektur, die bestehende Enterprise-Backends (SAP, PostgreSQL, Microsoft Dynamics) nahtlos einbindet:

01

Schicht 1: Client Storage & State Engine

Die Web-App (React, Vue oder Svelte) nutzt IndexedDB als persistenten Browserspeicher. State-Änderungen werden über Yjs-Doc-Instanzen kapselt und lokal in Mikrosekunden gespeichert.

02

Schicht 2: Asynchroner Transport & Relay-Knoten

Ein leichtgewichtiger Node.js oder Go WebSocket-Relay-Server nimmt State-Updates (Deltas) entgegen. Ist der Client offline, werden Updates lokal in einer IndexedDB-Outbox-Queue vorgehalten, bis die Verbindung wiederhergestellt ist.

03

Schicht 3: Persistence Backend & Enterprise Sync

Der Sync-Server konvertiert validierte CRDT-Updates in strukturierte SQL-Transaktionen auf der zentralen PostgreSQL-Datenbank. Hier greifen bestehende Sicherheits- & Business-Regeln.

Nachfolgend ein vereinfachtes Code-Beispiel für die Einrichtung einer lokalen Yjs-Instanz mit IndexedDB-Persistence und WebSocket-Sync in einer modern Frontend-Applikation:

import * as Y from 'yjs';
import { IndexeddbPersistence } from 'y-indexeddb';
import { WebsocketProvider } from 'y-websocket';

// 1. Initialisiere das Yjs-Dokument
const doc = new Y.Doc();

// 2. Kopple die lokale IndexedDB für sofortigen Offline-Zugriff (0 ms Latenz)
const providerIdb = new IndexeddbPersistence('b2b-wartungsauftrag-104', doc);

providerIdb.on('synced', () => {
  console.log('Lokale Daten erfolgreich aus IndexedDB geladen!');
});

// 3. Füge den asynchronen WebSocket-Provider für den Hintergrund-Sync hinzu
const providerWs = new WebsocketProvider(
  'wss://sync.ihre-firma.de',
  'b2b-wartungsauftrag-104',
  doc
);

// 4. Zugriff auf CRDT-Datenstrukturen (z. B. Map für Auftragsdaten)
const yMap = doc.getMap('auftragsDetails');

// Lokale Änderung – funktioniert offline wie online völlig identisch!
yMap.set('status', 'Prüfung abgeschlossen');
yMap.set('technikerKommentar', 'Ventil 4B erfolgreich ausgetauscht.');

6. B2B-Use-Cases: Wo Local-First Millionen einspart

Die Umstellung auf eine Local-First-Architektur ist kein akademischer Selbstzweck, sondern liefert in handfesten Branchenszenarien direkte betriebswirtschaftliche Vorteile:

1. Außendienst & Mobile Service-Apps

Servicetechniker im Maschinenbau arbeiten in tiefen Kellergeschossen oder Stahlbeton-Hallen ohne Mobilfunknetz. Mit Local-First erfassen sie Checklisten, Fotos und Messwerte ohne Ladezeiten. Bei Verlassen der Halle synchronisiert sich die App transparent im Vorbeigehen.

2. Shopfloor-Terminal & MES in der Produktion

In Fertigungslinien der Industrie 4.0 dürfen Netzwerkschwankungen im Firmen-WLAN niemals zum Stillstand von Band-Terminals führen. Local-First sichert die Ausführung von Produktionsschritten auch bei temporärem Ausfall der Kern-IT.

3. B2B-Kollaboration & Multi-User-Editoren

Kollaborative Konfiguratoren, Bauakten-Editoren oder komplexe Kalkulations-Tools profitieren von nahtloser Echtzeit-Zusammenarbeit mehrerer Ingenieure – ohne lästige "Datei ist durch Benutzer X gesperrt"-Meldungen.

7. Sicherheit, Ende-zu-Ende-Verschlüsselung & Compliance

Da bei Local-First vertrauliche Unternehmensdaten lokal auf den Endgeräten der Mitarbeiter gespeichert werden, stellen IT-Sicherheitsverantwortliche zu Recht strenge Compliance-Anforderungen. Die Architektur bietet hier gegenüber klassischen Cloud-Modellen entscheidende Sicherheitsvorteile:

Ende-zu-Ende-Verschlüsselung (E2EE)

CRDT-Updates können bereits auf dem Client symmetrisch (z. B. via Web Crypto API mit AES-GCM-256) verschlüsselt werden. Der WebSocket-Relay-Server im Internet fungiert als "Zero-Knowledge-Relay" – er leitet nur verschlüsselte Byte-Blobs weiter, ohne den Inhalt lesen zu können.

Datenschutz durch Local Storage (DSGVO & NIS-2)

Da die Primärdaten auf dem Endgerät verbleiben und nicht unverschlüsselt in Drittland-Clouds übertragen werden müssen, vereinfacht Local-First die Erfüllung strenger DSGVO- & NIS-2-Compliance-Auflagen deutlich.

Client-Side Database Encryption

Durch die Nutzung moderner Browser-APIs (OPFS + SQL.js / Origin Private File System) lassen sich auch lokale SQLite-Datenbanken auf dem Endgerät kryptografisch absichern.

8. Implementierungs-Roadmap & Quick-Check

Der Weg von einer monolithischen Cloud-App zu einer modernen Local-First-Architektur erfordert eine durchdachte Migration. Wir empfehlen mittelständischen Unternehmen folgende 5-Stufen-Roadmap:

  1. Schritt 1: Domain & Data Modeling Audit

    Identifikation der Datenbereiche, die eine hohe Offline-Relevanz besitzen. Trennung zwischen append-only Daten (Logs, Protokolle) und komplexen kollaborativen Datensätzen.

  2. Schritt 2: PoC mit Yjs oder Automerge

    Erstellung eines isolierten Proof-of-Concept für ein zentrales Frontend-Modul (z. B. Formular-Editor oder Außendienst-Protokoll) mit IndexedDB-Persistence.

  3. Schritt 3: Aufbau des Sync-Relay & Conflict Testing

    Implementierung des WebSocket-Sync-Services und Simulation extremer Offline-Szenarien (z. B. 3 Tage Offline-Arbeit von 5 Benutzern mit parallelen Änderungen).

  4. Schritt 4: Backend-Integration & PostgreSQL Replication

    Anbindung des Sync-Servers an die bestehende Enterprise-Datenbank. Umsetzung von Autorisierungs- & Row-Level-Security-Regeln.

  5. Schritt 5: Production Rollout & Monitoring

    Schrittweiser Rollout an Pilot-User im Außendienst und Überwachung der Sync-Performance sowie des Speicherbedarfs auf den Endgeräten.

Quick-Check: Ist Ihr Unternehmen bereit für Local-First?

Arbeiten Ihre Mitarbeiter regelmäßig in Bereichen mit schwacher oder fehlender Netzabdeckung?
Führen Ladezeiten und Latenzen bei der Erfassung von Daten zu Frust und Qualitätsverlusten?
Gibt es in Ihrer aktuellen Software gelegentlich Datenverluste durch parallele Bearbeitung?
Möchten Sie die Ausfallsicherheit Ihrer B2B-Systeme unabhängig von Cloud-Providern steigern?

Wenn Sie mindestens zwei dieser Fragen mit "Ja" beantworten, bietet eine Local-First-Software-Architektur den Schlüssel zu Ihrem nächsten Produktivitätssprung.

Haben Sie Fragen zur Local-First Architecture & CRDTs?

Kostenlose Erstberatung vereinbaren

Haben Sie eine Vision?

Lassen Sie uns gemeinsam prüfen, wie wir Ihre Idee zum Fliegen bringen.

Jetzt kostenloses Strategiegespräch buchen

Erweitertes Fachglossar

Local-First Software

Softwarearchitektur, bei der Daten primär lokal auf dem Endgerät des Nutzers (z. B. via IndexedDB) gespeichert und verarbeitet werden. Die Synchronisation mit Servern erfolgt asynchron im Hintergrund, wodurch die App vollständig offline-fähig und echtzeitfähig ist.

CRDT (Conflict-free Replicated Data Types)

Mathematische Datenstrukturen, die auf mehreren Geräten unabhängig voneinander und ohne zentrale Koordination verändert werden können. Sie garantieren durch kommutative und idempotent zusammengeführte Operationen eine konfliktfreie Zusammenführung aller Änderungen.

IndexedDB

Eine performante, objektorientierte NoSQL-Datenbank im Browser, die große Mengen strukturierter Daten lokal auf dem Client speichert und komplexe Abfragen und Transaktionen offline ermöglicht.

Eventual Consistency

Ein Konsistenzmodell in verteilten Systemen, das garantiert, dass alle Knoten nach Abschluss aller Schreiboperationen und erfolgreicher Synchronisation denselben Datenzustand einnehmen.

Yjs

Ein hochperformantes, quelloffenes CRDT-Framework für JavaScript, das kollektive Echtzeit-Zusammenarbeit und Offline-Editierung mit minimalem Speicher-Overhead und breiter Anbindung an Editoren bietet.

Automerge

Ein populäres CRDT-Framework in Rust und JavaScript, das eine Git-ähnliche Historie und automatisches Merging für komplexe JSON-Datenstrukturen in Local-First-Anwendungen bereitstellt.

Vector Clock

Ein Algorithmus zur kausalen Ordnung von Ereignissen in verteilten Systemen, der logische Zeitstempel pro Knoten nutzt, um Nebenläufigkeiten und Kausalitäten zweifelsfrei zu bestimmen.

Alexander Ohl

Alexander Ohl

Pragma-Code Support (AI)• Online

Hallo! Ich bin der Pragma-Code Assistent. Wie kann ich Ihnen heute helfen? Sie können mich zu unseren Dienstleistungen befragen oder direkt ein Thema auswählen.