Community Plugin

frontend

React performance optimization, UI polishing, UX design, and modern CSS for frontend applications

2.3.0

Updated 5 days ago

AI Insight

Optimizes React performance, polishes UI/UX, and implements modern CSS for frontend applications.

Why this plugin

Provides specialized agents and commands for improving frontend quality, focusing on performance bottlenecks, user experience, and visual design, streamlining development.

Prerequisites

Requires a React-based frontend project. No external API keys or specific dependencies mentioned.

react

performance

Install

Add the repository(one-time)

/plugin marketplace add acaprino/alfio-claude-plugins

Install the plugin

/plugin install frontend@alfio-claude-plugins

Components

Commands

Full Frontend Design & CSS Review

/review-design

inherits

Full design, layout, and CSS audit of the entire frontend — UX patterns, component hierarchy, spacing system, typography, accessibility, and visual consistency — outputs an actionable markdown report

Review Recent Frontend Changes

/review-frontend-changes

inherits

Review frontend code changes made in the current Claude Code session — React, performance, UX, CSS — and output an actionable markdown report

Agents

react-performance-optimizer

/react-performance-optimizer

opus

all tools

Expert in React 19 performance optimization including React Compiler, Server Components, bundle optimization, state management, and profiling. Fully compatible with tauri-optimizer for desktop apps. Use proactively for React performance reviews, bundle analysis, state management decisions, or re-render optimization.

Expert layout designer specializing in spatial composition, grid systems, responsive breakpoint strategy, and CSS Grid/Flexbox developer handoff. Use PROACTIVELY when designing page structure, above-the-fold layouts, responsive strategy, or translating layouts to implementation specs.

Use PROACTIVELY when improving UI aesthetics, adding animations, micro-interactions, polish, or making interfaces feel premium and expensive

Elite UI/UX designer specializing in beautiful, accessible interfaces and scalable design systems. Masters user research, design tokens, component architecture, and cross-platform consistency. Use PROACTIVELY for design systems, user flows, wireframes, or interface optimization.

Skills

modern-css

inherits

1 assets

Specialized knowledge for writing modern high-quality CSS. Trigger this skill when starting a new CSS project/file, when the user asks about new CSS features (e.g. Masonry, View Transitions, Container Queries, Scroll-driven animations), or requests refactoring of legacy styles to modern standards.

Stats

Stars0

Forks1

MaintenanceExcellent

Last Commit5 days ago

Community Promotion

Collections

Links

View on GitHub

View README

Plugin Marketplace JSON

Similar Plugins

cache-components

138.2k

Expert guidance for Next.js Cache Components and Partial Prerendering (PPR). Proactively activates in projects with cacheComponents: true, providing patterns for 'use cache' directive, cacheLife(), cacheTag(), cache invalidation, and parameter permutation rendering.

today

v1.0.0

claude-opus-4-5-migration

73.8k

Migrate your code and prompts from Sonnet 4.x and Opus 4.1 to Opus 4.5.

3mo

v1.0.0

ui-design

29.0k

Comprehensive UI/UX design plugin for mobile (iOS, Android, React Native) and web applications with design systems, accessibility, and modern patterns

v1.0.2

claude-mem

28.3k

Persistent memory system for Claude Code - seamlessly preserve context across sessions

v9.0.6