Skip to content

Browser-Only Architecture

DBModeler is a single-page application. It has no server-side application router and no backend model editor. The browser loads the app shell, and all project interaction happens on the client.

At a high level, DBModeler works like this:

  1. The browser loads the static app.
  2. Project state is resolved from local persistence or from a deep-linked project route.
  3. The editor loads the active project into memory.
  4. Optional integrations talk directly to provider APIs from the browser.

This design keeps the editor responsive and avoids coupling modeling work to a central application server.

DBModeler uses a client-side route format:

/p/<projectId>

That route is used to reopen or deep-link directly to a project. If no project route is present, the app falls back to the project list.

Project IDs are validated before lookup, and invalid paths fall back safely to the home view or to a not-found flow.

DBModeler splits persistence by responsibility.

Lightweight application state lives in localStorage, including the active project pointer and secret-manager metadata.

Full project records are stored in IndexedDB. This includes diagram state, versions, integrations, custom scripts, and sync snapshots.

While you are working, the active project is held in memory and synchronized back to storage through the application hooks.

DBModeler can connect directly from the browser to external providers.

  • Google Drive, OneDrive, Dropbox use OAuth 2.0 PKCE flows and provider APIs for sync.
  • GitHub and GitLab use Personal Access Tokens and provider APIs for repository operations.

These integrations are optional. The editor still works with browser-only storage when no external provider is configured.

Credentials do not need to stay in plain browser storage.

  • Personal Access Tokens can stay in memory only.
  • Refresh tokens and similar credentials can be stored in an encrypted vault.
  • The vault uses a master password, AES-GCM encryption, and Argon2id-based key derivation.

This is why the app can stay browser-only without treating browser persistence as fully trusted.

The architecture has a few practical consequences for users:

  • You can work locally without provisioning a backend.
  • Offline editing is possible for the core editor and PWA install flow.
  • External operations such as cloud sync and Git pushes still require network access.
  • Your chosen storage provider becomes part of your workflow design, not just a backup target.

For a first hands-on flow, continue with Quickstart.