marsai:dev-frontend-performance

Run frontend performance evaluations measuring Core Web Vitals, Lighthouse scores, and bundle sizes.

2|Updated Apr 10, 2026

Search Tags:#automation #performance #frontend #lighthouse #bundle-size #core-web-vitals #qa-analyst

Ready to run

npx skills add https://github.com/V4-Company/marsai --skill marsai-dev-frontend-performance

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: marsai:dev-frontend-performance
Source: https://github.com/V4-Company/marsai/tree/main/dev-team/skills/dev-frontend-performance
Command: npx skills add https://github.com/V4-Company/marsai --skill marsai-dev-frontend-performance

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Frontend development tasks often stumble when performance gates (CWV, Lighthouse scores, and bundle budgets) are not met, delaying delivery and eroding user experience. This Skill orchestrates a Gate-6 performance validation by coordinating a Frontend QA Analyst agent to measure, analyze, and hand off results for fixes before code review.

Core Features & Use Cases

Automates Core Web Vitals checks (LCP, CLS, INP) across affected pages.
Runs Lighthouse audits and compares scores against a baseline.
Analyzes bundle size changes and ensures tree-shakeable imports.
Dispatches targeted frontend engineers to fix regressions and re-validate.

Quick Start

Run Gate 6 frontend performance evaluation for the target feature to verify Core Web Vitals, Lighthouse score, and bundle size against baseline.

Frequently Asked Questions about marsai:dev-frontend-performance

High-intent search queries and answers about installing and using this skill.

FAQPage Schema

How do I validate Core Web Vitals like LCP, CLS, and INP for my frontend feature?▼

You validate Core Web Vitals by running a structured frontend performance evaluation that measures LCP, CLS, and INP across affected pages. This process coordinates a QA Analyst agent to measure metrics and hand off regressions for fixes before code review.

What is the best way to automate Lighthouse audits and compare scores against a baseline?▼

Automating Lighthouse audits involves running a structured evaluation that executes Lighthouse and compares scores against a baseline. It analyzes bundle size changes, audits client components, and validates tree-shakeable imports to ensure performance targets are met.

How do I check bundle size changes and ensure tree-shakeable imports in my application?▼

You check bundle size changes by running a structured frontend performance evaluation that analyzes bundle variations and validates tree-shakeable imports. It audits client components to ensure bundle size targets and Lighthouse score thresholds are met.

Does this frontend performance evaluation work for E2E flows and performance budgets?▼

Yes, the frontend performance evaluation is applicable to E2E flows and performance budgets. It orchestrates Gate-6 validation across diverse pages and components, measuring Core Web Vitals and running Lighthouse to ensure performance thresholds are met.

Why do I need a QA Analyst agent for frontend performance gates?▼

You need a QA Analyst agent to orchestrate Gate-6 performance validation by measuring LCP, CLS, INP, and bundle changes. It dispatches targeted frontend engineers to fix regressions and re-validate before code review, preventing delivery delays.