sqltoerdiagram: a browser ERD tool whose share link is a compressed URL

One runtime dependency and a hand-written parser

The dependency budget is one library. `@dagrejs/dagre` at ^1.1.4 is the only runtime dependency, and it exists for one job, layered auto-layout. Vite at ^5.4.0 is the only development dependency.

Everything else is written for the project: a custom canvas renderer and a SQL DDL parser, and the README states that the heavy SQL parser libraries were deliberately avoided. That choice is visible in the grammar the parser accepts, which covers `CREATE [OR REPLACE] [TEMPORARY | TRANSIENT] TABLE [IF NOT EXISTS]` with quoted, backticked, bracketed and schema-qualified names, inline column constraints, table-level constraints, `ALTER TABLE x ADD [CONSTRAINT ...] FOREIGN KEY`, and it ignores line and block comments.

That is a narrower grammar than a database would accept, and knowing its edges is cheaper than finding them later.

The bin entry point points at a CLI the README never mentions

The manifest declares a command-line entry point that the documentation never explains:

"bin": {
  "sql-to-er-diagram": "./bin/cli.js"
}

There is a `bin/` directory at the root of the repository, so the file exists, and the manifest is `"private": true`, which is why the field has no effect on an npm install today. Nothing in the README, the feature list or the hosting section mentions a CLI, and the script list has no entry for it either.

The test story is similarly thin and equally explicit. The whole suite is one command, `node test/edit.test.mjs`, pointing at a single file inside `test/`, so the tested surface is the canvas-to-SQL edit path rather than the parser or the layout.

The name is `sql-to-er-diagram` at version 0.1.0, the site is sqltoerdiagram.com, and there are no tagged releases to match against.

The dialect list and the BigQuery mode do not line up

The parse feature covers five dialects: PostgreSQL, MySQL, SQLite, SQL Server and Snowflake. The add-column default types name the same five. Then a separate section documents BigQuery as a choice in the dialect dropdown, which makes it a sixth entry in the picker.

What BigQuery does there is not DDL parsing. You paste a raw `WITH ... AS (...)` query, each common table expression becomes a table node, column names come from the SELECT list using aliases where present, and relationships are inferred from FROM and JOIN references, with references to base tables producing stub nodes attached to the CTE. Backtick-quoted three-part names are supported and the table portion becomes the node label.

So BigQuery is a query analyser wearing the same dropdown as a dialect selector, which is why it gets its own section and its own rules.

A rename on the canvas rewrites every REFERENCES clause

The canvas is editable and the edits are surgical. Double-clicking a table name, a column name or a column type opens an inline editor, and the change is applied to the SQL text as a targeted edit that preserves comments, formatting and clauses the parser does not model. A table rename updates every REFERENCES to it, which is the operation most tools get wrong.

Columns can be added from the canvas too. You pin a table, press the add control, and the new column is inserted with a default type chosen for the selected dialect, then opens inline so you can name it. Editing a column type offers suggestions that follow the same dialect rules.

That combination, a diagram you can correct and SQL that survives the correction, is the reason the tool calls itself two-way rather than one-way.

Sharing is a gzip blob in the URL hash

The share feature copies a URL with the entire project encoded in the fragment, gzip-compressed and then base64 encoded. Because a fragment after `#` is never sent to a server, sharing needs no backend at all, and opening the link restores the exact diagram.

That has an obvious corollary: the share link contains your schema, in compressed form, in the address bar. It is worth knowing before a link is pasted into a channel.

The other persistence paths are files. Save downloads a project as JSON containing the SQL, the layout, the camera and the dialect, and Open loads one back. Export produces PNG for raster and SVG for vector. Annotations, the sticky notes and group boxes from the palette in the bottom-left corner, are part of the diagram rather than an overlay, so they travel through saves, share links and both export formats.

Layout keeps your manual positions when the SQL changes

Auto-arrange is hub-aware: the most connected table is placed on one side with its related tables aligned beside it, then a separation pass guarantees no two tables overlap. Direction, horizontal or vertical, and spacing, compact, comfortable or spacious, live under the Arrange menu, which also re-runs the layout on demand.

What happens to your own arrangement is the useful detail. Positions and the camera persist automatically, so a reload restores your exact layout, and when you edit the SQL the manual positions are kept and only brand-new tables are auto-placed. Re-running the layout is therefore an explicit choice rather than a side effect of typing.

For dense schemas the display starts deliberately muted: foreign key lines are soft by default, hovering a table highlights just its relationships, and clicking pins focus and fades everything unrelated, with a click on empty space clearing it.

The performance numbers come with a named workload

The renderer uses cached bitmaps with viewport culling, and the claims are specific rather than adjectival: about 120 frames per second while zooming a 300 table diagram with 593 foreign keys, and roughly 6 ms for a full repaint of a 45KB script covering 300 tables, sub-millisecond on normal schemas.

The SQL editor is built the same way. Syntax highlighting is not a library but a paint layer behind the textarea, colouring keywords, types, strings, comments and numbers, and re-tokenising is a single linear pass coalesced to one animation frame so typing stays responsive.

Running it locally is two commands, `npm install` then `npm run dev`, and the production build writes plain static files to `dist/`. Hosting is then a choice of a `gh-pages` branch, Netlify, Vercel, Cloudflare Pages with `dist` as the publish directory, or any web server or bucket at all. Shortcuts are minimal: the keyboard combo re-arranges, a double-click on the canvas zooms in, and dragging the divider resizes the editor.

Editorial conclusion

sqltoerdiagram fits a reviewer or a developer who needs a diagram of a schema quickly and does not want a schema uploaded to anyone's server, because the whole tool is a static page you can self-host from a bucket. It does not fit a pipeline that needs the diagram produced by a script, since the tool is a browser app and the CLI entry point in the manifest goes undocumented. Before you rely on it, check whether your DDL is inside the supported grammar, remember the BigQuery option is a different mode rather than a sixth dialect, and decide whether a share link carrying the entire schema in its hash is acceptable for your data.

Frequently asked questions

Official sources

1. Issues
2. License: MIT
3. Project website
4. README
5. royalbhati/sqltoerdiagram on GitHub