Mermaid Support

[brophdawg11]

It would be awesome to add mermaid support in our markdown files via mermaid code blocks like github has:

https://github.blog/2022-02-14-include-diagrams-markdown-files-mermaid/

Then we could include all sorts of diagrams in our markdown files.

References:

• https://github.com/mermaid-js/mermaid
• https://github.com/remcohaszing/rehype-mermaid

[kandros]

👋 @brophdawg11
I was able to make it work

Turns out rehype-mermaid depends on playwright in order to render the image, do you think this is acceptable or is a blocker to continue?

[brophdawg11]

I think folks on twitter were saying mermaid adds pretty significant bundle bloat - can you confirm/deny the change in client-side JS payload when this is added?

If there is a bloat I think we may need to look into lazily loading the mermaid dependencies and rendering the diagrams client side only - although that could introduce a potentially bad CLS if the diagram was above the fold. I wonder if they could be pre-rendered to SVG's on the server somehow