Vast

• 

  vast

Inspiration

Every "AI edits your app" demo we'd seen worked the same way: an LLM either writes DOM-manipulation code and hopes it doesn't break something, or a browser-automation layer clicks around pretending to be a mouse. Neither one actually knows what a "connector" or a "frame" means in the app it's touching it's reverse-engineering intent from pixels.

We'd already built Vast as a from-scratch realtime canvas rooms, shapes, live cursors, a shared undo stack as its own project, no AI involved. When WebMCP landed, the fit was obvious: Vast is already multiplayer. Every edit already goes through a typed, named function (create_element, align_elements, undo_action) over the same Socket.IO connection every guest uses. Making an agent a participant didn't mean bolting on a special "AI mode" it meant registering those exact functions as tools and letting an agent join the room like any other guest.

What it does

How we built it

The base —Vite/React/TypeScript/Canvas2D client, Node/Express/Socket.IO server in a layered architecture, Postgres for shape state and an event log came together first, over about five days, ~14,000 lines. WebMCP went in afterward in a single focused push, under one rule: no separate agent path. Every tool calls the exact same socket events a human edit fires.

Challenges we ran into

Accomplishments that we're proud of

One code path, not two an agent literally cannot do anything the UI itself couldn't. Undo/redo that's genuinely shared between human and agent, cascades and all. A believable peer, not a gimmick the agent gets a name, color, and cursor because the server has no privileged notion of "human" to begin with. Real, deployable output via export_html, not just a screenshot of a session. Native-first: proving out where WebMCP is headed, not propping up an API that doesn't exist yet.

What we learned

What's next for Vast

More tools under the same rule grouping, z-order, true component instances. Multi-agent rooms, to stress-test the undo stack with more than one agent peer at once. Giving the agent read access to why something was drawn (nearby notes, replay history), not just current state. Scoped tool permissions once the server has real auth, without breaking the no-separate-path guarantee. Following WebMCP beyond Chrome as other runtimes adopt document.modelContext.

Built With

• backend:-node.js
• docker
• express.js
• multer
• nanoid-infra:-docker-/-docker-compose-flat-tag-list-version-for-a-"built-with"-field:-react
• node.js
• pg
• postgresql
• socket.io
• tailwindcss
• typescript
• vite
• webmcp