mrkeyoor.com_
Tue 01 Sept 17:08 UTC
Dev Toolsevaluationupdated 28 Aug 2026

mermaid review

Mermaid turns Markdown-like text into diagrams and charts, so architecture and process visuals can live beside the documentation they explain. It tackles diagram drift by making visuals easy to edit in source control instead of locking them inside a drawing file.

+52 / 4dstars / 7d
Verdict

Our run installed 2,209 packages, then completed both the 38-second build and 217-second test step successfully. Mermaid is the sensible default when diagrams need to live in Markdown, source control, or a JavaScript application, especially because GitHub and many other tools already understand it. Use an existing integration when possible; adopt the full monorepo only if you need to extend or embed the renderer deeply.

We ran it

Install✓ · 414s2209 packages · 1095 MB
Build✓ · 38s
Tests✓ · 217sran, no count parsed
Repo3094 files~188,754 lines of source · 16.9 MB · 23 CI workflows · Dockerfile · tests dir

Answers from our run

Does mermaid build from source?

Dependencies installed in 414 seconds (2209 packages), and the build succeeded in 38 seconds. We cloned commit 756ae42 into a clean Debian container with 3 CPUs and no project-specific setup.

Do mermaid's tests pass?

The test command failed in our container, and its output did not report a pass or fail count.

Who should not use mermaid?

Teams that need precise, free-form visual design rather than layout from text

What are the alternatives to mermaid?

PlantUML, D2, Kroki. Our run installed 2,209 packages, then completed both the 38-second build and 217-second test step successfully.

Setup3/5All steps passed, but install took 414s and 1,095 MB
Docs4/5Clear entry points, guides, tutorials, and integration links
Community5/589,966 stars, fresh pushes, and recent releases
Maturity5/5Established since 2014 with CI and visual regression testing

Discussed on

  1. hnMermaid: Create diagrams and visualizations using text and code349 points
  2. hnMermaid: Generation of diagrams like flowcharts or sequence diagrams from text255 points
  3. hnShow HN: Mermaid Chart VS Code Plugin: Mermaid.js Diagrams in Visual Studio Code138 points
  4. hnGeneration of diagrams and flowcharts from text in a similar manner as markdown111 points
  5. hnMermaid – Generation of diagrams and flowcharts from text103 points

Who it’s for

Engineering teams that want diagrams reviewed alongside code
Documentation maintainers working in GitHub or other Mermaid-aware tools
Developers who need diagram generation inside scripts or web applications
Non-designers who prefer a text definition or Live Editor to a drawing canvas

Who it’s NOT for

Teams that need precise, free-form visual design rather than layout from text
Small projects unwilling to absorb a large Node development dependency tree
Maintainers who expect a tiny contributor setup with near-instant installation
Users who need every diagram change to preserve exact manual positioning

Setup reality

Our fresh Debian-container run succeeded end to end: pnpm installed 2,209 packages in 414 seconds and occupied 1,095 MB, the build finished in 38 seconds, and tests passed in 217 seconds. That is a healthy result, but it is considerably heavier than the README's approachable Live Editor and Markdown-like syntax suggest. Using Mermaid through an existing integration may be simple; developing the 3,094-file monorepo is a substantial Node toolchain commitment.

Mermaid makes diagrams behave more like documentation

Mermaid's central idea is practical: describe a diagram with Markdown-inspired text, render it, and keep that definition near the code or prose it explains. That replaces opaque drawing files with text that can be reviewed, diffed, copied, and updated. The project explicitly frames this as an answer to documentation drift, where diagrams become stale because changing them costs more time than changing the system.

The approach has had more than a decade to spread. The repository was created in 2014, has 89,966 stars in the supplied snapshot, and is directly supported in GitHub as well as many community integrations. A Live Editor gives non-programmers a way to work without first building an application, while npm and CDN paths serve developers who want Mermaid inside a site or production script.

Our clean-container run passed, but the contributor setup is heavy

We cloned commit 756ae42 into a fresh, unprivileged Debian container with 3 CPUs and 8 GB of RAM. The repository contained 3,094 files, about 188,754 lines of source, and occupied 16.9 MB before dependencies. It uses Node with pnpm and monorepo workspaces, so this was a full contributor-style checkout rather than a quick experiment in the hosted editor.

Our run installed successfully, but installation was the dominant cost: 2,209 packages took 414 seconds and consumed 1,095 MB on disk. The build then succeeded in 38 seconds, and the test step succeeded in 217 seconds. Those are the only performance figures we can responsibly report, and they describe setup on our box rather than end-user rendering speed.

The successful build and tests are reassuring because nothing required secrets, privileged access, or an improvised fix. Still, the dependency footprint changes the setup story. Someone merely writing a flowchart in an already supported Markdown system will face much less work than someone modifying Mermaid itself. The friendly syntax is not evidence that its development environment is small.

The repository also carries 23 CI workflow files, a Dockerfile, a compose file, and a dedicated tests directory. Those signals fit a project that treats releases and contributions as production work. They also mean maintainers should budget for a real monorepo workflow, not assume that the Live Editor's simplicity carries over to hacking on every package.

Its strongest feature is the path from text to many destinations

Mermaid's biggest advantage is not merely that it draws diagrams. It gives teams a common source format that can work in documentation, GitHub, web applications, scripts, the Live Editor, and CDN-based pages. That range reduces the pressure to choose a separate authoring tool for each publishing destination. Text definitions also make small conceptual changes easier to inspect during code review.

The README provides several useful entry points instead of pretending one workflow fits everyone: documentation, getting started material, usage guidance, tutorials, integrations, npm, CDN delivery, and the Live Editor. It even exposes previews for develop and next releases. Visual changes receive dedicated attention through Argos-powered pull-request regression checks and Applitools in the release process, a valuable discipline for a renderer whose correctness is partly visual.

Mermaid is also approachable across roles. Developers can generate or modify diagrams from code, documentation teams can keep definitions beside prose, and less technical contributors can use the browser editor. The README links a Simplified Chinese version too, although the main project materials presented here are in English. This is a better adoption path than requiring every contributor to understand the entire rendering stack.

Version and activity signals are strong: the supplied latest release is @mermaid-js/tiny 11.17.2 from August 25, 2026, and the last push was August 27, 2026. Those dates, only days before this review, matter more than star count alone. They show an actively changing project rather than a famous repository surviving mainly on historical adoption.

Scale creates real rough edges

The clearest drawback is weight. A dependency installation larger than a gigabyte is not trivial for constrained CI workers, occasional contributors, or teams hoping to vendor a small utility. The monorepo structure can also make it harder to understand which package and command matter for a narrowly scoped change. None of that makes the end-user library inherently slow, but it does raise contributor and maintenance costs.

The repository reports 1,747 open issues. At this scale, that number may include feature requests, integrations, rendering edge cases, and old reports, so it is not proof of poor maintenance. It is still a warning that Mermaid spans a wide surface area and that a particular syntax or layout problem may already have a long discussion rather than a quick resolution. Test your own diagrams before committing to a publishing workflow.

Automatic layout is another tradeoff inherent to text-defined diagramming. It is excellent when structure and maintainability matter more than art direction, but less suitable when a designer needs exact placement, bespoke typography, or pixel-level composition. Syntax is easier to diff than a canvas file, yet complex definitions can become code-like artifacts that need their own conventions and review discipline.

It belongs in the documentation pipeline, not at every layer

In a real stack, Mermaid fits best at authoring and rendering boundaries: Markdown in a repository, a documentation generator, a GitHub page, or a web component that turns trusted definitions into visuals. Keep the diagram source beside the system description, review both together, and render through an existing integration when that meets the requirement. A central service such as Kroki is worth considering when one organization must support several diagram languages.

For 2026-era teams, the decision is straightforward. Choose Mermaid when editable text, broad integration, and source-controlled diagrams outweigh the desire for manual visual control. The recent 11.17.2 release, August 27 push, successful build, and successful test run make it a credible production choice. Just separate the easy authoring experience from the much heavier job of developing its full repository.

Alternatives

ProjectWhat it isPick it when
PlantUMLA mature text-to-diagram system with broad UML coverage and a Java-based toolchain.pick this instead when UML notation and long-established enterprise integrations matter more than a JavaScript-native stack.
D2A modern declarative diagram language with an emphasis on attractive automatic layouts.pick this instead when you want a standalone diagram language and its layout options rather than Mermaid syntax embedded in Markdown.
KrokiA service that exposes many diagram engines, including Mermaid, through one API.pick this instead when a central rendering endpoint for several diagram syntaxes is more useful than adopting one renderer directly.
nomnomlA compact text-based tool focused on UML-style diagrams in the browser.pick this instead when your scope is mostly lightweight UML and you value a narrower project.

What people are saying

  1. [velocity-scout] mermaid-js/mermaid
  2. [hackernews] Show HN: Line9 – A Mermaid rendering engine with its own layout
  3. [theverge] The Mermaid Mask is a perfect vacation murder mystery

Sources

  1. Mermaid GitHub repository
  2. Mermaid open-source homepage

More dev tools reviews

workmux · v2rayNG · SecLists · hashcat · eslint · fastfetch · the whole board →