feat: server-side PNG + .excalidraw snapshot rendering#16
Open
feat: server-side PNG + .excalidraw snapshot rendering#16
Conversation
Add excalirender (roughjs SVG) + resvg (WASM PNG) pipeline for server-side diagram rendering. Gated behind enableSnapshots option — only active in local stdio/HTTP mode, Vercel is unaffected. - New src/snapshot-renderer.ts: isolated module (~200 lines) - Label shorthand expansion (shape + arrow labels) - Font loading from excalirender's bundled TTFs - Outputs PNG + .excalidraw to /tmp/excalidraw-snapshots/ - Dynamic import: deps never loaded when snapshots disabled - Updated README with MCP Tools section and non-MCP-Apps notice
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
niieani
reviewed
Feb 13, 2026
| }, | ||
| "scripts": { | ||
| "postinstall": "node scripts/setup-bun.mjs || echo 'setup-bun.mjs failed or not available'", | ||
| "build": "tsc --noEmit && cross-env INPUT=src/mcp-app.html vite build && mv dist/src/mcp-app.html dist/mcp-app.html && rmdir dist/src && tsc -p tsconfig.server.json && bun build src/server.ts --outdir dist --target node && bun build src/main.ts --outfile dist/index.js --target node --banner \"#!/usr/bin/env node\"", |
There was a problem hiding this comment.
Suggested change
| "build": "tsc --noEmit && cross-env INPUT=src/mcp-app.html vite build && mv dist/src/mcp-app.html dist/mcp-app.html && rmdir dist/src && tsc -p tsconfig.server.json && bun build src/server.ts --outdir dist --target node && bun build src/snapshot-renderer.ts --outdir dist --target node && cp node_modules/canvas/build/Release/*.dylib dist/ && bun build src/main.ts --outfile dist/index.js --target node --banner \"#!/usr/bin/env node\"", |
I know this is still in progress, but I just tried it - without the renderer and dylib the dist the rendering doesn't work (it falls in to the catch clause that doesn't report anything)
|
@antonpk1 Is there any update on this feature? PNG export would be a very useful functionality for adding the Excalidraw charts everywhere. The current flow asks you to replace your canvas every time, which is not the best UX. |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
4 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Adds server-side diagram rendering for local stdio MCP builds, so the MCP is useful for clients that don't support MCP Apps (Claude Code, Cursor, Windsurf, etc.).
Pipeline
What it does
create_viewcall saves a PNG snapshot +.excalidrawfile to/tmp/excalidraw-snapshots/enableSnapshotsoption — only active in local stdio/HTTP modeDependencies
Files
src/snapshot-renderer.tssrc/server.tssrc/main.ts{ enableSnapshots: true }README.md