performance-security

Official

Build fast, accessible, secure React apps.

AuthorMadAppGang
Version1.0.0
Installs0

System Documentation

What problem does it solve?

Ensuring React applications are performant, accessible, and secure requires adherence to many best practices across different domains. This Skill consolidates critical guidelines for production-ready apps.

Core Features & Use Cases

  • Performance Optimization: Implement code-splitting, image optimization (WebP, lazy loading), and leverage the React Compiler for speed.
  • Accessibility (a11y): Ensure WCAG AA compliance with semantic HTML, ARIA attributes, keyboard navigation, and color contrast.
  • Security Hardening: Prevent XSS, protect secrets, validate all untrusted data, and implement Content Security Policy.
  • Use Case: Audit an existing React application for common security vulnerabilities, identify areas for performance improvement (e.g., large bundle sizes), and ensure all interactive elements are keyboard accessible.

Quick Start

Use the performance-security skill to audit the current project for common security vulnerabilities.

Dependency Matrix

Required Modules

rollup-plugin-visualizerdompurify

Components

Standard package

💻 Claude Code Installation

Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.

Please help me install this Skill:
Name: performance-security
Download link: https://github.com/MadAppGang/claude-code/archive/main.zip#performance-security

Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
View Source Repository

Agent Skills Search Helper

Install a tiny helper to your Agent, search and equip skill from 223,000+ vetted skills library on demand.