ADR-017: Mermaid.js for Architecture Diagrams
- Status: Accepted
- Date: 2026-02-20
- Deciders: Simon
Context and Problem Statement
Visual representations of our architecture (e.g., building block views, runtime sequences) are essential for understanding the system. We need a way to create and maintain these diagrams without relying on external design tools.
Decision Drivers
- Documentation-as-Code: Easy to edit and version alongside the documentation.
- Simplicity: Markdown-based syntax for defining diagrams.
- Integration: Direct support in GitHub, GitLab, and many Markdown editors.
Considered Options
- Static Images (PNG/SVG): Created with external tools and checked into the repository.
- Mermaid.js: Text-based diagramming language rendered directly from Markdown.
- PlantUML: More feature-rich but requires a separate server or JAR file for rendering.
Decision Outcome
Chosen option: Mermaid.js (implemented in commit 9af6391), because it offers the best balance of features, ease of use, and native integration with the project's documentation and hosting platforms.
Consequences
- Positive: Easy to maintain and version, improved readability within the documentation files, and better support for collaboration.
- Negative: Limited styling options compared to dedicated design tools.
- Integration: Leveraged by the arc42 documentation (ADR-015).