mcpengine/studio/docs/TECHNICAL-ARCHITECTURE.md
Jake Shore 96e52666c5 MCPEngine full sync — studio scaffold, factory v2, server updates, state.json — 2026-02-12
=== NEW ===
- studio/ — MCPEngine Studio scaffold (Next.js monorepo, build plan)
- docs/FACTORY-V2.md — Factory v2 architecture doc
- docs/CALENDLY_MCP_BUILD_SUMMARY.md — Calendly MCP build report

=== UPDATED SERVERS ===
- fieldedge: Added jobs-tools, UI build script, main entry update
- lightspeed: Updated main + server entry points
- squarespace: Added collection-browser + page-manager apps
- toast: Added main + server entry points

=== INFRA ===
- infra/command-center/state.json — Updated pipeline state
- infra/command-center/FACTORY-V2.md — Factory v2 operator playbook
2026-02-12 17:58:33 -05:00

680 lines
29 KiB
Markdown

# MCPEngine Studio — Technical Architecture
**Version:** 1.0 | **Date:** February 2026 | **Status:** Implementation-Ready
---
## 1. System Architecture
```
┌─────────────────────────────────────────────────────────────────────────┐
│ MCPEngine Studio (Vercel) │
│ │
│ ┌──────────────┐ ┌──────────────┐ ┌──────────────┐ ┌────────────┐ │
│ │ Next.js │ │ React Flow │ │ WYSIWYG │ │ Marketplace│ │
│ │ App Shell │ │ Tool Editor │ │ App Designer│ │ Browser │ │
│ └──────┬───────┘ └──────┬───────┘ └──────┬───────┘ └─────┬──────┘ │
│ │ │ │ │ │
│ ▼ ▼ ▼ ▼ │
│ ┌─────────────────────────────────────────────────────────────────┐ │
│ │ Next.js API Routes │ │
│ │ POST /api/analyze POST /api/generate POST /api/design │ │
│ │ POST /api/test POST /api/deploy GET /api/marketplace │ │
│ └──────────────────────────┬──────────────────────────────────────┘ │
│ │ │
│ ┌───────────────────────────▼─────────────────────────────────────┐ │
│ │ AI Pipeline Engine │ │
│ │ ┌─────────┐ ┌──────────┐ ┌──────────┐ ┌──────┐ ┌──────────┐ │ │
│ │ │Analyzer │ │ Builder │ │ Designer │ │Tester│ │ Deployer │ │ │
│ │ │ Skill 1 │ │ Skill 2 │ │ Skill 3 │ │Sk. 5 │ │ Skill 6 │ │ │
│ │ └────┬────┘ └────┬─────┘ └────┬─────┘ └──┬───┘ └────┬─────┘ │ │
│ │ └──────┬────┴────────┬───┴───────┬───┘ │ │ │
│ │ ▼ ▼ ▼ ▼ │ │
│ │ Claude API (anthropic/claude-sonnet-4-5) │ │
│ └─────────────────────────────────────────────────────────────────┘ │
│ │ │
│ ┌───────────────────────────▼─────────────────────────────────────┐ │
│ │ PostgreSQL (Neon) │ │
│ │ users · projects · servers · tools · apps · deployments │ │
│ │ marketplace_listings · usage_logs · api_keys │ │
│ └─────────────────────────────────────────────────────────────────┘ │
└─────────────────────────────────────────────────────────────────────────┘
┌─────────────────────────────────────────────────────────────────────────┐
│ Cloudflare Workers (User MCP Servers) │
│ │
│ ┌──────────┐ ┌──────────┐ ┌──────────┐ ┌──────────┐ │
│ │ user-123 │ │ user-456 │ │ user-789 │ │ ... │ │
│ │ trello │ │ zendesk │ │ custom │ │ │ │
│ │ server │ │ server │ │ server │ │ │ │
│ └──────────┘ └──────────┘ └──────────┘ └──────────┘ │
│ │
│ Cloudflare R2: Server bundles, app assets, spec files │
└─────────────────────────────────────────────────────────────────────────┘
```
---
## 2. Skill-to-Service Mapping
Each of our 11 pipeline skills becomes an API service:
| Skill | API Endpoint | Trigger | Input | Output |
|-------|-------------|---------|-------|--------|
| **mcp-api-analyzer** | `POST /api/analyze` | User uploads spec | OpenAPI spec / URL / raw docs | Structured analysis JSON (endpoints, auth, tool groups, app candidates) |
| **mcp-server-builder** | `POST /api/generate` | User clicks "Generate" from tool editor | Tool config + analysis | TypeScript MCP server source code (streamed) |
| **mcp-app-designer** | `POST /api/design` | User triggers from App Designer | Tool definitions + layout config | HTML app files (9 patterns) |
| **mcp-localbosses-integrator** | Internal only | Automatic during generation | Server + apps | Integration config (not user-facing) |
| **mcp-qa-tester** | `POST /api/test` | User clicks "Run Tests" | Generated server code | Test results: pass/fail, coverage, issues |
| **mcp-deployment** | `POST /api/deploy` | User clicks "Deploy" | Compiled server bundle | Deployed URL + endpoint config |
| **mcp-apps-official** | Embedded in Designer | Powers App Designer WYSIWYG | User design actions | MCP App resource bundles |
| **mcp-apps-integration** | Embedded in Designer | Template patterns | structuredContent config | HTML+JS app bundles |
| **mcp-apps-merged** | Reference for all app generation | Powers validation | App config | Compliance check |
| **mcp-server-development** | Embedded in Builder | Best practices injection | Server config | TypeScript patterns |
| **mcp-skill** | `POST /api/research` | Optional: research API capabilities | Search query | API documentation findings |
---
## 3. Frontend Architecture
### Tech Stack
- **Framework:** Next.js 15 (App Router)
- **Styling:** Tailwind CSS 4 + custom design tokens
- **Visual Editor:** React Flow v12 (tool canvas)
- **App Designer:** GrapesJS or custom WYSIWYG
- **State:** Zustand (client) + React Query (server)
- **Real-time:** WebSocket via Vercel Edge Functions
- **Auth:** Clerk (dev → WorkOS for enterprise)
### Component Tree
```
app/
├── (marketing)/
│ ├── page.tsx # Landing page
│ └── pricing/page.tsx # Pricing page
├── (auth)/
│ ├── sign-in/page.tsx
│ └── sign-up/page.tsx
├── (dashboard)/
│ ├── layout.tsx # NavRail + main area
│ ├── page.tsx # Dashboard (project grid)
│ ├── projects/[id]/
│ │ ├── layout.tsx # Editor layout (canvas + inspector)
│ │ ├── page.tsx # Tool Editor (React Flow)
│ │ ├── apps/page.tsx # App Designer (WYSIWYG)
│ │ ├── test/page.tsx # Testing Dashboard
│ │ └── deploy/page.tsx # Deploy Flow
│ └── marketplace/
│ ├── page.tsx # Browse templates
│ └── [templateId]/page.tsx # Template detail
├── api/
│ ├── analyze/route.ts # Spec analysis endpoint
│ ├── generate/route.ts # Server code generation
│ ├── design/route.ts # App UI generation
│ ├── test/route.ts # Run test suite
│ ├── deploy/route.ts # Deploy to Cloudflare
│ ├── marketplace/route.ts # Marketplace CRUD
│ └── webhooks/
│ ├── stripe/route.ts # Billing webhooks
│ └── clerk/route.ts # Auth webhooks
└── components/
├── nav-rail/ # Left navigation (icon dock)
├── canvas/ # React Flow wrapper + custom nodes
│ ├── ToolNode.tsx # Visual tool block
│ ├── GroupNode.tsx # Tool group container
│ └── ConnectionEdge.tsx # Tool chain connectors
├── inspector/ # Right panel (context-sensitive)
│ ├── ToolInspector.tsx # Tool config panel
│ ├── ParamEditor.tsx # Parameter schema editor
│ └── AuthConfig.tsx # Auth flow configuration
├── app-designer/ # WYSIWYG components
│ ├── ComponentPalette.tsx # Drag-drop widget library
│ ├── DesignCanvas.tsx # Visual preview area
│ └── PropertyPanel.tsx # Widget properties
├── marketplace/ # Template browser
├── deploy/ # Deployment stepper
└── shared/ # Buttons, cards, inputs, toasts
```
### Key UI Zones (3 max)
```
┌────┬──────────────────────────────────┬──────────────┐
│ │ │ │
│ N │ │ │
│ A │ CANVAS │ INSPECTOR │
│ V │ (React Flow / WYSIWYG / │ (context- │
│ │ Test Results / Deploy) │ sensitive) │
│ R │ │ │
│ A │ │ │
│ I │ │ │
│ L │ │ │
│ │ │ │
└────┴──────────────────────────────────┴──────────────┘
64px flex-1 320px
```
---
## 4. Backend API Design
### REST Endpoints
```typescript
// === Analysis ===
POST /api/analyze
Body: { specUrl?: string, specFile?: string, rawDocs?: string }
Response: StreamingResponse (SSE) AnalysisResult
interface AnalysisResult {
id: string;
service: string;
endpoints: Endpoint[];
authFlow: AuthConfig;
toolGroups: ToolGroup[];
appCandidates: AppCandidate[];
rateLimits: RateLimitInfo;
}
// === Generation ===
POST /api/generate
Body: { projectId: string, tools: ToolConfig[], auth: AuthConfig }
Response: StreamingResponse (SSE) GenerationProgress ServerBundle
interface ServerBundle {
files: { path: string; content: string }[];
packageJson: object;
tsConfig: object;
entryPoint: string;
}
// === App Design ===
POST /api/design
Body: { projectId: string, appType: AppPattern, tools: string[], layout: LayoutConfig }
Response: StreamingResponse (SSE) AppBundle
type AppPattern =
| 'dashboard' | 'data-grid' | 'form' | 'card-list'
| 'timeline' | 'calendar' | 'kanban' | 'chart' | 'detail-view';
// === Testing ===
POST /api/test
Body: { projectId: string, testLayers: TestLayer[] }
Response: StreamingResponse (SSE) TestResult[]
type TestLayer =
| 'protocol' | 'static' | 'visual' | 'functional'
| 'performance' | 'security';
// === Deployment ===
POST /api/deploy
Body: { projectId: string, target: DeployTarget, config: DeployConfig }
Response: StreamingResponse (SSE) DeployResult
type DeployTarget = 'mcpengine' | 'npm' | 'docker' | 'cloudflare' | 'download';
interface DeployResult {
url: string;
endpoint: string;
status: 'live' | 'pending';
logs: string[];
}
// === Marketplace ===
GET /api/marketplace # List templates
GET /api/marketplace/:id # Template detail
POST /api/marketplace/:id/fork # Fork template into project
POST /api/marketplace/publish # Publish project as template
// === Projects ===
GET /api/projects # List user projects
POST /api/projects # Create project
GET /api/projects/:id # Get project detail
PATCH /api/projects/:id # Update project
DELETE /api/projects/:id # Delete project
```
### WebSocket (Real-time Updates)
```typescript
// Client connects to ws://app/api/ws?projectId=xxx
// Server streams events during generation/testing/deployment:
type WSEvent =
| { type: 'analysis:progress', step: string, percent: number }
| { type: 'analysis:tool_found', tool: ToolDefinition }
| { type: 'analysis:complete', result: AnalysisResult }
| { type: 'generate:progress', file: string, percent: number }
| { type: 'generate:file_ready', path: string, content: string }
| { type: 'generate:complete', bundle: ServerBundle }
| { type: 'test:running', layer: TestLayer }
| { type: 'test:result', layer: TestLayer, passed: boolean, details: string }
| { type: 'deploy:progress', step: string, percent: number }
| { type: 'deploy:live', url: string }
| { type: 'error', message: string, recoverable: boolean };
```
---
## 5. Database Schema
```sql
-- Users (synced from Clerk)
CREATE TABLE users (
id UUID PRIMARY KEY DEFAULT gen_random_uuid(),
clerk_id TEXT UNIQUE NOT NULL,
email TEXT UNIQUE NOT NULL,
name TEXT,
avatar_url TEXT,
tier TEXT NOT NULL DEFAULT 'free' CHECK (tier IN ('free','pro','team','enterprise')),
stripe_customer_id TEXT,
team_id UUID REFERENCES teams(id),
created_at TIMESTAMPTZ DEFAULT now(),
updated_at TIMESTAMPTZ DEFAULT now()
);
-- Teams (for Team/Enterprise tiers)
CREATE TABLE teams (
id UUID PRIMARY KEY DEFAULT gen_random_uuid(),
name TEXT NOT NULL,
slug TEXT UNIQUE NOT NULL,
owner_id UUID NOT NULL REFERENCES users(id),
tier TEXT NOT NULL DEFAULT 'team',
stripe_subscription_id TEXT,
max_seats INT DEFAULT 5,
created_at TIMESTAMPTZ DEFAULT now()
);
-- Projects (one per MCP server being built)
CREATE TABLE projects (
id UUID PRIMARY KEY DEFAULT gen_random_uuid(),
user_id UUID NOT NULL REFERENCES users(id),
team_id UUID REFERENCES teams(id),
name TEXT NOT NULL,
slug TEXT NOT NULL,
description TEXT,
status TEXT DEFAULT 'draft' CHECK (status IN ('draft','analyzed','generated','tested','deployed')),
spec_url TEXT,
spec_raw JSONB,
analysis JSONB, -- cached AnalysisResult
tool_config JSONB, -- user's tool editor state
app_config JSONB, -- user's app designer state
auth_config JSONB, -- OAuth/API key config
server_bundle JSONB, -- generated code metadata
template_id UUID REFERENCES marketplace_listings(id), -- if forked
created_at TIMESTAMPTZ DEFAULT now(),
updated_at TIMESTAMPTZ DEFAULT now(),
UNIQUE(user_id, slug)
);
-- Tools (individual MCP tools within a project)
CREATE TABLE tools (
id UUID PRIMARY KEY DEFAULT gen_random_uuid(),
project_id UUID NOT NULL REFERENCES projects(id) ON DELETE CASCADE,
name TEXT NOT NULL,
description TEXT,
group_name TEXT,
input_schema JSONB NOT NULL,
output_schema JSONB,
annotations JSONB, -- readOnlyHint, destructiveHint, etc.
enabled BOOLEAN DEFAULT true,
position INT DEFAULT 0, -- order in canvas
canvas_x FLOAT, -- React Flow position
canvas_y FLOAT,
created_at TIMESTAMPTZ DEFAULT now()
);
-- Apps (MCP App UIs within a project)
CREATE TABLE apps (
id UUID PRIMARY KEY DEFAULT gen_random_uuid(),
project_id UUID NOT NULL REFERENCES projects(id) ON DELETE CASCADE,
name TEXT NOT NULL,
pattern TEXT NOT NULL, -- dashboard, data-grid, form, etc.
layout_config JSONB, -- WYSIWYG layout state
html_bundle TEXT, -- generated HTML
tool_bindings JSONB, -- which tools feed data to this app
created_at TIMESTAMPTZ DEFAULT now()
);
-- Deployments
CREATE TABLE deployments (
id UUID PRIMARY KEY DEFAULT gen_random_uuid(),
project_id UUID NOT NULL REFERENCES projects(id),
user_id UUID NOT NULL REFERENCES users(id),
target TEXT NOT NULL, -- mcpengine, npm, docker, cloudflare
status TEXT DEFAULT 'pending' CHECK (status IN ('pending','building','live','failed','stopped')),
url TEXT,
endpoint TEXT,
worker_id TEXT, -- Cloudflare Worker ID
version TEXT,
logs JSONB,
created_at TIMESTAMPTZ DEFAULT now(),
stopped_at TIMESTAMPTZ
);
-- Marketplace Listings
CREATE TABLE marketplace_listings (
id UUID PRIMARY KEY DEFAULT gen_random_uuid(),
project_id UUID NOT NULL REFERENCES projects(id),
author_id UUID NOT NULL REFERENCES users(id),
name TEXT NOT NULL,
slug TEXT UNIQUE NOT NULL,
description TEXT,
category TEXT, -- crm, ecommerce, hr, finance, etc.
tags TEXT[],
icon_url TEXT,
preview_url TEXT,
tool_count INT,
app_count INT,
fork_count INT DEFAULT 0,
is_official BOOLEAN DEFAULT false, -- our 37 servers
is_featured BOOLEAN DEFAULT false,
price_cents INT DEFAULT 0, -- 0 = free
status TEXT DEFAULT 'review' CHECK (status IN ('review','published','rejected','archived')),
created_at TIMESTAMPTZ DEFAULT now(),
published_at TIMESTAMPTZ
);
-- Usage Tracking
CREATE TABLE usage_logs (
id UUID PRIMARY KEY DEFAULT gen_random_uuid(),
user_id UUID NOT NULL REFERENCES users(id),
action TEXT NOT NULL, -- analyze, generate, test, deploy
project_id UUID REFERENCES projects(id),
tokens_used INT,
duration_ms INT,
created_at TIMESTAMPTZ DEFAULT now()
);
-- API Keys (for deployed servers needing user's service credentials)
CREATE TABLE api_keys (
id UUID PRIMARY KEY DEFAULT gen_random_uuid(),
project_id UUID NOT NULL REFERENCES projects(id) ON DELETE CASCADE,
user_id UUID NOT NULL REFERENCES users(id),
key_name TEXT NOT NULL, -- e.g., TRELLO_API_KEY
encrypted_value TEXT NOT NULL, -- AES-256 encrypted
created_at TIMESTAMPTZ DEFAULT now()
);
-- Indexes
CREATE INDEX idx_projects_user ON projects(user_id);
CREATE INDEX idx_projects_team ON projects(team_id);
CREATE INDEX idx_tools_project ON tools(project_id);
CREATE INDEX idx_apps_project ON apps(project_id);
CREATE INDEX idx_deployments_project ON deployments(project_id);
CREATE INDEX idx_marketplace_category ON marketplace_listings(category);
CREATE INDEX idx_marketplace_featured ON marketplace_listings(is_featured) WHERE is_featured = true;
CREATE INDEX idx_usage_user_date ON usage_logs(user_id, created_at);
```
---
## 6. AI Pipeline Architecture
### How User Actions Trigger Skills
```
User Action Skill Used Claude Call
─────────────────────────────────────────────────────────────────
Upload OpenAPI spec → mcp-api-analyzer → System prompt: skill content
User prompt: spec content
Streaming: tool-by-tool analysis
Click "Generate Server" → mcp-server-builder → System prompt: skill + analysis
+ mcp-server-development User prompt: tool config JSON
Streaming: file-by-file generation
Design MCP App → mcp-app-designer → System prompt: skill + patterns
+ mcp-apps-official User prompt: layout + tool bindings
+ mcp-apps-merged Streaming: HTML bundle
Run Tests → mcp-qa-tester → System prompt: skill + server code
User prompt: "run layer X tests"
Streaming: test-by-test results
Deploy → mcp-deployment → System prompt: skill
User prompt: target + config
Result: deployment script
```
### Pipeline Implementation
```typescript
// lib/ai-pipeline.ts
import Anthropic from '@anthropic-ai/sdk';
const client = new Anthropic();
// Each skill is loaded as a system prompt
const SKILLS = {
analyzer: fs.readFileSync('skills/mcp-api-analyzer/SKILL.md', 'utf-8'),
builder: fs.readFileSync('skills/mcp-server-builder/SKILL.md', 'utf-8'),
designer: fs.readFileSync('skills/mcp-app-designer/SKILL.md', 'utf-8'),
tester: fs.readFileSync('skills/mcp-qa-tester/SKILL.md', 'utf-8'),
deployer: fs.readFileSync('skills/mcp-deployment/SKILL.md', 'utf-8'),
appsGuide: fs.readFileSync('skills/mcp-apps-merged/SKILL.md', 'utf-8'),
serverDev: fs.readFileSync('skills/mcp-server-development/SKILL.md', 'utf-8'),
};
export async function* analyzeSpec(spec: string): AsyncGenerator<AnalysisEvent> {
const stream = client.messages.stream({
model: 'claude-sonnet-4-5-20250514',
max_tokens: 8192,
system: SKILLS.analyzer,
messages: [{ role: 'user', content: `Analyze this API spec:\n\n${spec}` }],
});
for await (const event of stream) {
// Parse streaming chunks → yield structured events
yield parseAnalysisChunk(event);
}
}
export async function* generateServer(
analysis: AnalysisResult,
toolConfig: ToolConfig[]
): AsyncGenerator<GenerationEvent> {
const systemPrompt = [SKILLS.builder, SKILLS.serverDev].join('\n\n---\n\n');
const stream = client.messages.stream({
model: 'claude-sonnet-4-5-20250514',
max_tokens: 16384,
system: systemPrompt,
messages: [{
role: 'user',
content: `Generate MCP server from this analysis and tool config:\n\nAnalysis:\n${JSON.stringify(analysis)}\n\nTool Config:\n${JSON.stringify(toolConfig)}`
}],
});
for await (const event of stream) {
yield parseGenerationChunk(event);
}
}
// Similar for designApp(), runTests(), deploy()
```
### Cost Estimation Per Operation
| Operation | Model | ~Tokens | ~Cost | Time |
|-----------|-------|---------|-------|------|
| Analyze spec | Sonnet | 3K in + 4K out | $0.03 | 8-15s |
| Generate server | Sonnet | 8K in + 12K out | $0.10 | 20-40s |
| Design app | Sonnet | 5K in + 6K out | $0.05 | 10-20s |
| Run tests | Sonnet | 6K in + 4K out | $0.04 | 10-15s |
| Full pipeline | Sonnet | ~22K in + 26K out | $0.22 | 60-90s |
At $0.22/pipeline run, even free tier users (3 servers) cost ~$0.66 per user. Sustainable.
---
## 7. Deployment Architecture
### App Hosting (Vercel)
```
mcpengine.com → Next.js app (Vercel)
api.mcpengine.com → API routes (Vercel Edge)
ws.mcpengine.com → WebSocket (Vercel Edge)
```
### User MCP Server Hosting (Cloudflare Workers)
```
{slug}.mcpengine.run → User's deployed MCP server
```
Each deployed server becomes a Cloudflare Worker:
1. User clicks "Deploy to MCPEngine"
2. Backend compiles TypeScript → bundled JS
3. Cloudflare API: `PUT /client/v4/accounts/{id}/workers/scripts/{name}`
4. DNS: add `{slug}.mcpengine.run` route
5. Server is live with SSE transport (MCP over HTTP)
### Asset Storage (Cloudflare R2)
```
r2://mcpengine-assets/
├── specs/ # Uploaded OpenAPI specs
├── bundles/ # Generated server bundles
├── apps/ # MCP App HTML bundles
└── marketplace/ # Template preview assets
```
### CI/CD
- **App:** Push to `main` → Vercel auto-deploy
- **Workers:** Deploy API → Cloudflare Wrangler
- **Database:** Neon branching for staging
---
## 8. Real-time Collaboration (Team Tier)
### Architecture
- **Presence:** Vercel Edge WebSocket → broadcast cursor positions
- **Conflict resolution:** Operational Transform (OT) for tool config edits
- **Change feed:** PostgreSQL LISTEN/NOTIFY → WebSocket broadcast
### Implementation
```typescript
// Multiplayer cursors on React Flow canvas
interface PresenceEvent {
userId: string;
userName: string;
avatar: string;
cursor: { x: number; y: number };
selectedNode?: string;
view: 'editor' | 'designer' | 'test' | 'deploy';
}
```
---
## 9. Security Model
### User Isolation
- All projects scoped to `user_id` — no cross-user data access
- Deployed Workers run in isolated V8 sandboxes (Cloudflare)
- API keys encrypted with AES-256-GCM, per-user encryption keys
### Auth Flow
1. Clerk handles sign-up/sign-in (social + email)
2. JWT in Authorization header for API calls
3. Clerk webhook syncs user to PostgreSQL
4. Team membership checked via `team_id` on every request
### API Key Security
- User's service credentials (e.g., TRELLO_API_KEY) stored encrypted
- Decrypted only at deploy time → injected as Worker environment variables
- Never exposed in generated code or API responses
- Key rotation support via re-deploy
### Rate Limiting
| Tier | Analyze/hr | Generate/hr | Deploy/day |
|------|-----------|------------|-----------|
| Free | 5 | 3 | 2 |
| Pro | 50 | 30 | 20 |
| Team | 200 | 100 | 50 |
| Enterprise | Unlimited | Unlimited | Unlimited |
---
## 10. Scaling Strategy
### Phase 1 (0-1K users): Simple
- Vercel Pro plan (~$20/mo)
- Neon free tier (PostgreSQL)
- Cloudflare Workers free tier (100K req/day)
- Total infra: ~$50/mo
### Phase 2 (1K-10K users): Scale compute
- Vercel Team (~$150/mo)
- Neon Pro ($19/mo)
- Cloudflare Workers Paid ($5/mo + usage)
- Redis (Upstash) for rate limiting + caching
- Total infra: ~$300/mo
### Phase 3 (10K+ users): Optimize
- Cloudflare Workers Bundled for user servers
- R2 for all asset storage
- Edge caching for marketplace
- Queue system (Cloudflare Queues) for async generation
- Total infra: ~$1K-5K/mo (scales with revenue)
### Performance Budgets
| Metric | Target |
|--------|--------|
| Landing page LCP | < 1.5s |
| Editor load | < 2s |
| Spec analysis start | < 500ms |
| Generation streaming start | < 1s |
| Deploy completion | < 30s |
| WebSocket reconnect | < 2s |
---
## 11. Marketplace Migration (37 Servers → Templates)
### Migration Script
```bash
for server in mcpengine-repo/servers/*/; do
name=$(basename $server)
# Extract metadata
tools=$(grep -c "server.tool(" $server/src/index.ts)
apps=$(ls $server/app-ui/*.html 2>/dev/null | wc -l)
# Create marketplace listing
INSERT INTO marketplace_listings (
name, slug, description, category,
tool_count, app_count, is_official, status
) VALUES (
$name, $name, <from README>, <auto-categorize>,
$tools, $apps, true, 'published'
);
# Bundle source into R2
tar czf /tmp/$name.tar.gz -C $server .
wrangler r2 object put mcpengine-assets/marketplace/$name.tar.gz --file /tmp/$name.tar.gz
done
```
### Categories for 37 Servers
| Category | Servers |
|----------|---------|
| **CRM** | close, pipedrive, keap, housecall-pro |
| **eCommerce** | bigcommerce, squarespace, lightspeed, clover |
| **HR/Payroll** | bamboohr, gusto, rippling |
| **Finance** | freshbooks, wave, toast |
| **Marketing** | mailchimp, brevo, constant-contact, meta-ads |
| **Support** | zendesk, freshdesk, helpscout |
| **Project Mgmt** | trello, clickup, wrike, basecamp |
| **Scheduling** | acuity-scheduling, calendly |
| **Communication** | twilio |
| **Field Service** | servicetitan, jobber, fieldedge, touchbistro |
| **Real Estate** | reonomy |
| **Dev Tools** | google-console |
| **Automation** | n8n-apps, closebot |
---
*Document Version: 1.0 | Last Updated: February 6, 2026*