Skill UI

Controls Chrome via the DevTools MCP to navigate pages, interact with elements, inspect console and network data, capture snapshots/screenshots, and record performance traces for live web debugging and profiling tasks.

Guides engineers building Flutter 3+ cross-platform apps through project setup, Riverpod/Bloc state management, GoRouter navigation, custom widgets, and performance tuning backed by const optimization, testing, and DevTools profiling.

Comprehensive Go guidance for browser automation and web scraping using Rod’s direct Chrome DevTools Protocol integration plus stealth anti-detection patterns, ideal for headless SPA testing, concurrent scraping, and request interception.

Guides measuring, analyzing, and optimizing web performance through a structured workflow, Lighthouse/DevTools scripts, bundle analysis, memory/runtime inspections, quick wins, and anti-pattern avoidance.

This guide helps diagnose and resolve performance bottlenecks in React applications. It teaches developers how to profile slow components using DevTools, identify unnecessary re-renders, and apply targeted optimizations like memoization (useMemo, useCallback) and state isolation to improve rendering speed and overall user experience.

Use Chrome DevTools MCP to give the agent visibility into the real browser so you can inspect DOM, console logs, network traffic, screenshots, and performance data while building, debugging, or validating UI behavior that runs in a browser.

This skill provides expert-level control over a live Chrome browser. It enables full web automation (clicking, form filling, navigation), deep debugging (analyzing console logs, network requests), visual inspection (screenshots, snapshots), and detailed performance profiling. Ideal for QA engineers, web scraping, and front-end development testing.