skills.rest
bryanvillamilpragma
bryanvillamilpragmaCOMMUNITY
Explore all skills by this author →
GitHub

performance-optimizer

Analyze Core Web Vitals, bundle size, and rendering time in React, Angular, and Next.js projects.

3|Updated May 5, 2026
Search Tags:#bundle size#performance optimization#performance audit#Core Web Vitals#rendering performance
One-click install
npx skills add https://github.com/bryanvillamilpragma/power-Pragma --skill performance-optimizer-bryanvillamilpragma
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: performance-optimizer
Source: https://github.com/bryanvillamilpragma/power-Pragma/tree/main/skills-registry/workflows/performance-optimizer
Command: npx skills add https://github.com/bryanvillamilpragma/power-Pragma --skill performance-optimizer-bryanvillamilpragma

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) and references (resource) components.

What problem does it solve?

This Skill identifies and addresses performance bottlenecks, enhancing Core Web Vitals, bundle size, and rendering speed, ensuring a smoother user experience.

Core Features & Use Cases

  • Performance Auditing: Measures and categorizes performance issues.
  • Optimization Recommendations: Provides detailed fixes with before/after impact estimates.
  • Customizable Analysis: Analyzes project-specific components or entire projects.
  • Use Case: For a React project with a large user base, this Skill can pinpoint slow components and offer optimizations to reduce load times and improve responsiveness.

Quick Start

Run the performance-optimizer Skill on your project to identify and optimize performance issues.

Frequently Asked Questions about performance-optimizer

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

FAQPage Schema
How do I audit Core Web Vitals and rendering performance in a React project?▼

Analyze your React project files and configuration to measure Core Web Vitals, categorize rendering performance bottlenecks, and identify slow components impacting user experience.

What is the best way to reduce bundle size in Next.js applications?▼

The best way to reduce bundle size is to run a performance audit that analyzes your Next.js project files, identifies bloat, and provides targeted optimization recommendations with before and after impact estimates.

Can I use this performance optimization approach for Angular projects?▼

Yes, performance optimization applies to Angular projects alongside React and Next.js, requiring access to your project files and configuration to accurately measure and address rendering speed and bundle size.

How do I get optimization recommendations with impact estimates for slow components?▼

You get optimization recommendations by running a performance audit on your project, which provides detailed fixes and before and after impact estimates for targeted slow components.

Do I need access to project configuration files to measure rendering performance?▼

Yes, you need access to project files and configuration to accurately measure rendering performance, Core Web Vitals, and bundle size for precise optimization recommendations.

Related Skills

Explore More Software Engineering Skills→
Rosetears520Rosetears520
2

performance-optimization

Establish performance baselines, diagnose frontend and backend bottlenecks, and verify fixes.

Community
Intermediate
patrickhaahrpatrickhaahr

vercel-react-best-practices

Identify and apply React/Next.js performance best practices for rendering, data fetching, and bundle size.

Community
Basic
blockmatic-iceboxblockmatic-icebox
4

vercel-react-best-practices

Apply React and Next.js performance best practices across components, pages, and data fetching.

Official
Advanced
DanialHaseebDanialHaseeb

optimize

Diagnose and fix UI performance issues across loading, rendering, animations, images, and bundle size.

Community
Advanced