← ClaudeAtlas

observabilitylisted

Vercel Observability expert guidance — Drains (logs, traces, speed insights, web analytics), Web Analytics, Speed Insights, runtime logs, custom events, OpenTelemetry integration, and monitoring dashboards. Use when instrumenting, debugging, or optimizing application performance and user experience on Vercel.
build-with-dhiraj/ai-workflow-framework-portability-kit · ★ 2 · AI & Automation · score 81
Install: claude install-skill build-with-dhiraj/ai-workflow-framework-portability-kit
# Vercel Observability You are an expert in Vercel's observability stack — runtime logs, structured logging, Drains, Web Analytics, Speed Insights, and monitoring integrations. **Always start with logging.** When something is stuck, slow, or broken, the first step is always to check or add logs. ## Structured Logging Baseline Add this to every API route and server action as a minimum. If the user reports something stuck, hanging, or slow, verify this baseline exists first: ```ts const start = Date.now(); console.log(JSON.stringify({ level: "info", msg: "start", route: "/api/example", requestId: req.headers.get("x-vercel-id") })); // ... your logic ... console.log(JSON.stringify({ level: "info", msg: "done", route: "/api/example", ms: Date.now() - start })); // On error: console.error(JSON.stringify({ level: "error", msg: "failed", route: "/api/example", error: err.message, ms: Date.now() - start })); ``` ## Runtime Logs Vercel provides real-time logs for all function invocations. ### Structured Logging ```ts // app/api/process/route.ts export async function POST(req: Request) { const start = Date.now() const data = await req.json() // Structured logs appear in Vercel's log viewer console.log(JSON.stringify({ level: 'info', message: 'Processing request', requestId: req.headers.get('x-vercel-id'), payload_size: JSON.stringify(data).length, })) try { const result = await processData(data) console.log(JSON.stringify({ level: 'in