# mermaid preview benchmark

implementation based on main 3e60fecf39f37faaca9bdf37e64b7a58229ea547. the earlier before crop used baseline 20012ebd80b06a4c10ab0e78893822e7f873b2a8. all fixtures are generated, not provider responses.

## engine comparison

pinned beautiful-mermaid 1.1.3 and mermaid 12.0.0. playwright 1.58.2, chromium 151.0.7922.34. raw.jsonl contains 120 valid rows across flow, sequence, class, er and a 40-edge chain. validation checked positive dimensions and expected labels; this is not proof of full mermaid compatibility. round order alternates engines. each page renders a first pass then a warm pass. cold-first-diagram means first render for that source, not a fresh process or uncached network for every diagram.

median first-pass render: official 52.20 ms, beautiful 10.90 ms, 20 observations each.
median warm render: official 22.20 ms, beautiful 4.05 ms, 40 observations each.

## real production application

isolated copied database had zero messages. seeded 30 labeled fixtures, then exercised the actual built web application, timeline virtualization, existing copy control, hide control, and workspace markdown file preview.

latest integrated run observed 30/30 distinct visible message ids and 15 requested previews with valid dimensions and expected labels. accumulated two complete runs are retained append-only. median request-to-decoded-image over both runs: first pass 153.62 ms, warm pass 1 42.01 ms, warm pass 2 42.12 ms. these include playwright interaction overhead and are not engine-only timings.

actual composer typing while requesting the 40-edge diagram retained the full entered text. latest run had a maximum animation-frame interval of 116.60 ms. earlier normal-height run reached 133.40 ms and 144 ms event duration. this is measurable main-thread jank, not a claim of imperceptible rendering. requests are opt-in, serialized and bounded, but synchronous in-flight layout cannot be cancelled. native slower devices could perform worse.

source clipboard contents matched the flow source. markdown file preview rendered the diagram and retained source after using the existing rendered-markdown toggle.

## architecture and limits

lazy beautiful-mermaid engine, shared web/native static output, image isolation rather than SVG DOM insertion, external-resource/active-SVG rejection, generated font import removed. source remains available. no rendering during streaming or for unfinished fences. conservative native duplicate-source unfinished-fence handling can suppress a completed duplicate too.

this is a deliberately narrow static subset, not full mermaid support. simple spaced flowcharts, basic sequence messages/participants, class declarations/relations and er relations only. compact flow arrows, changed later node declarations, markdown-string delimiters, directives, styles, links, subgraphs, activation, semicolon chaining and ampersand groups remain code. 8,000 source characters, 64 meaningful lines, 60 flow edges, 16 pending requests, 16 cached images or approximately 2 million stored characters. errors retain source.

production lazy engine chunk dist-Dvu8hHlm.js: 1,522,921 bytes, 460,611 gzip bytes. substantial optional download, not free. ordinary markdown does not import it until requested.

shared web renderer also serves file previews, attachments, plans and pull-request markdown. mobile adapters include native timeline and file previews, with separate platform UI. client-runtime, web and mobile typechecks passed. 76 focused shared/web tests passed after rebase. native device execution and packaged electron execution were not available and are not claimed.

## reproduction

bench/package.json and lock pin dependencies. run node run.mjs against the benchmark vite server for engine comparison. seed.py creates generated fixtures only in repo/.t3/userdata/state.sqlite. production scripts app-run.mjs, app-evidence.mjs and file-run.mjs require the isolated application server on port 13774; they mint local pairing links in memory. update the configured chromium executable path for another environment. do not publish pairing files or database snapshots.