skills.rest
boparaiamrit
boparaiamritCOMMUNITY
Explore all skills by this author →
GitHub

frontend-audit

Audit frontend codebases for architecture, state management, accessibility, and performance issues.

5|1|Updated Feb 7, 2026
Search Tags:#architecture#performance#accessibility#frontend#audit#state-management#bundle-analysis
One-click install
npx skills add https://github.com/boparaiamrit/skills-by-amrit --skill frontend-audit
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: frontend-audit
Source: https://github.com/boparaiamrit/skills-by-amrit/tree/main/skills/frontend-audit
Command: npx skills add https://github.com/boparaiamrit/skills-by-amrit --skill frontend-audit

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Frontend code quality directly impacts user experience. Audits identify architecture gaps, state management inefficiencies, accessibility issues, design-system inconsistencies, and performance bottlenecks.

Core Features & Use Cases

  • Component architecture review and SRP conformance
  • State management assessment and refactor guidance
  • Accessibility conformance checks across components
  • Design token usage verification and visual consistency
  • Performance analysis including bundle size, rendering speed, and lazy-loading opportunities

Quick Start

Provide the codebase URL and ask for a prioritized frontend audit report.

Frequently Asked Questions about frontend-audit

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

FAQPage Schema
How do I audit my frontend codebase for architecture and performance issues?▼

To audit your frontend codebase, provide the repository URL to receive a prioritized report identifying architecture gaps, state management inefficiencies, accessibility issues, and performance bottlenecks across your components.

Does this frontend audit work with Vue and Svelte projects or only React?▼

Yes, this frontend audit works with React, Vue, Svelte, and vanilla JS projects, evaluating component design, state flow, design token usage, and rendering performance across these frameworks.

What is component SRP conformance and how do I check it in my frontend code?▼

Component SRP conformance checks whether a component has a single responsibility. You can evaluate this in your frontend code by reviewing the component architecture to identify structural gaps and ensure proper separation of concerns.

How do I identify state management inefficiencies and refactor my frontend components?▼

You can identify state management inefficiencies by assessing state flow within your frontend components. The audit provides refactor guidance to address these architectural gaps and improve data handling.

Can I check accessibility conformance and design token consistency across my components?▼

Yes, you can check accessibility conformance across your components and verify design token usage to ensure visual consistency, identifying areas where your frontend UI fails to meet accessibility standards.

What is the best way to analyze frontend bundle size and find lazy-loading opportunities?▼

The best way to analyze frontend bundle size is through a performance audit that evaluates rendering speed, token usage, and lazy-loading opportunities, providing measurable performance improvements for your application.

Related Skills

Explore More Software Engineering Skills→
stefanbosakstefanbosak

doc-search

Index and retrieve documentation from official sources, GitHub, and private repositories.

Community
Advanced
Camilo8902Camilo8902

frontend-refactor-planner

Generate phased frontend refactoring plans with risk assessment and done criteria.

Community
Advanced
hopeoverturehopeoverture
6

ui-library-usage-auditor

Audit shadcn/ui component usage for accessibility and design-system conformance.

Community
Advanced
lasswelltlasswellt
1

perf-profile

Profile bundle size, runtime performance, and Lighthouse results for Vue/Nuxt projects.

Community
Advanced