📋 Copy Blueprint Command { } Inspect JSON API Ground-Truth Source ↗

⚡ 1-Click Agent & Developer Install

Zero Auth · Ready for Grok Bot, Claude Code & Cursor

### 1. Problem & Operational Bottleneck Scan Astro/Next.js templates for `<img>` tags missing explicit width/height attributes or unpreloaded web fonts causing layout shift. Built and battle-tested in production workflows by **@ericosiu** (Eric Siu (@ericosiu)). ### 2. Target Architecture & Required Stack - **Playwright MCP** - **Visual Sentinel MCP** - **GitHub MCP** ### 3. Step-by-Step Implementation Blueprint 1. Connect Playwright MCP, Visual Sentinel MCP, GitHub MCP and verify read-only access to the target workspace. 2. Run the discovery query for 'Automated Cumulative Layout Shift (CLS) & Image Dimension Fixer' to establish baseline metrics and identify anomalies. 3. Generate a structured remediation or execution artifact with full source citations and diffs. 4. Stage any mutating actions behind an explicit human approval gate and verify final state. ### 4. Copy-Paste Agent Execution Prompt ```markdown Execute the 'Automated Cumulative Layout Shift (CLS) & Image Dimension Fixer' (seo-core-web-vitals-cls-font-and-image-fixer) blueprint with Playwright MCP, Visual Sentinel MCP, GitHub MCP. Goal: Scan Astro/Next.js templates for `<img>` tags missing explicit width/height attributes or unpreloaded web fonts causing layout shift. First inspect live state in read-only mode, validate all identifiers and metrics, and output a concrete action plan with verification commands before making any changes. ``` ### 5. Verification & Safety Guardrails - **Human-in-the-Loop Gate:** All external communications, production database mutations, and billing actions stage an explicit review diff before execution. - **Deterministic Telemetry:** Every run logs structured JSON output, latency metrics, and source citations so operators can audit every decision.

Tags: #playwright-mcp#visual-sentinel-mcp#github-mcp#blueprint#marketing-seo

View All 45 Items by @ericosiu →

use case · ⚡ 95

Sales Call Transcripts to High-Intent SEO & AI Answer Engine (AEO) Guides

Extracts real buyer objections and comparison questions from recorded sales calls to generate technical comparison pages with FAQPage JSON-LD.

use case · ⚡ 94

Deal-Desk Pipeline Velocity & Stalled Opportunity Slack Digest

Cross-references CRM deal stages against recent email and calendar activity every morning—flagging enterprise deals with zero touchpoints in 5+ days.

template · ⚡ 92

Deal Desk & Vendor Renewal Negotiation Strategist

Benchmarks SaaS vendor quotes, audits auto-renewal clauses, models multi-year discount levers, and drafts redline counter-offers for founder sign-off.