Which frameworks is this audit skill designed for?

While it can be adapted, it is primarily optimized for React ecosystems, including support for Tailwind CSS, TypeScript, and various state management libraries.

Can I customize the audit criteria?

Absolutely. Phase 3 includes a mandatory checkpoint where you define component size limits, performance targets, and architectural priorities.

Does it require the Gemini CLI?

Yes, Phase 4 of the workflow utilizes the Gemini CLI for high-context deep analysis of the codebase files.

What kind of performance issues does it find?

It identifies missing code-splitting opportunities, unnecessary re-renders (missing memoization), N+1 data fetching patterns, and heavy library imports.

Comprehensive Frontend Audit

Name: Comprehensive Frontend Audit
Author: Expanly

byExpanly

0•

Design Tools

Conducts multi-phase frontend architecture audits to optimize React performance, Tailwind patterns, and TypeScript quality.

This skill provides a structured 7-phase workflow for auditing complex frontend codebases. It guides Claude through discovery, codebase mapping, and deep analysis using the Gemini CLI to identify performance bottlenecks, architectural anti-patterns, and type safety gaps. By evaluating component complexity, prop-drilling, and bundle sizes, it generates prioritized action plans—ranging from high-ROI 'quick wins' to comprehensive refactoring strategies—making it indispensable for teams scaling React applications.

Key Features

01Automated pattern analysis for Tailwind CSS and shadcn/ui

02Deep performance analysis targeting LCP, FID, and bundle size

030 GitHub stars

04Multi-phase audit workflow from discovery to actionable planning

05Component architecture mapping and prop-drilling detection

06Customizable analysis thresholds for component size and test coverage

Use Cases

01Preparing a legacy React codebase for scaling or modernization

02Conducting deep performance reviews to improve Core Web Vitals

03Standardizing architectural patterns and TypeScript quality across a team

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add expanly/expanly-claude-code-agents comprehensive-frontend-audit

For use in Claude.ai and ChatGPT

Key Features

01Automated pattern analysis for Tailwind CSS and shadcn/ui

02Deep performance analysis targeting LCP, FID, and bundle size

030 GitHub stars

04Multi-phase audit workflow from discovery to actionable planning

05Component architecture mapping and prop-drilling detection

06Customizable analysis thresholds for component size and test coverage

Use Cases

01Preparing a legacy React codebase for scaling or modernization

02Conducting deep performance reviews to improve Core Web Vitals

03Standardizing architectural patterns and TypeScript quality across a team

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add expanly/expanly-claude-code-agents comprehensive-frontend-audit

For use in Claude.ai and ChatGPT