optimize

Diagnose and fix UI performance issues across web applications.

Updated Apr 3, 2026
One-click install
npx skills add https://github.com/yahya-azeem/Pokedex --skill optimize-yahya-azeem
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: optimize
Source: https://github.com/yahya-azeem/Pokedex/tree/main/library/impeccable/skills/optimize
Command: npx skills add https://github.com/yahya-azeem/Pokedex --skill optimize-yahya-azeem

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

It diagnoses and fixes UI performance problems that make apps feel slow, laggy, janky, or heavy to load.

Core Features & Use Cases

  • Performance-first diagnosis: Measures Core Web Vitals, load time, bundle size, runtime behavior, and network patterns to find the real bottleneck.
  • Targeted optimization plan: Provides concrete improvements across loading, rendering, animations, framework performance, and network efficiency.
  • Core Web Vitals verification: Helps you validate improvements with before/after metrics, real-device testing, and regression checks.

Use Case: If your product is failing to hit good LCP/INP on mobile, use this skill to produce a prioritized fix list for images, JavaScript/CSS, rendering hotspots, and network payloads.

Quick Start

Use the optimize skill to generate a before-and-after performance plan for your UI and specify the exact changes to reduce load time, improve rendering smoothness, and shrink bundle weight.

Frequently Asked Questions about optimize

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

FAQPage Schema
How do I fix Core Web Vitals regressions for LCP, INP, and CLS on mobile?

Fix Core Web Vitals regressions by systematically measuring LCP, INP, and CLS on real devices, identifying primary bottlenecks, and implementing targeted improvements for images, JavaScript, CSS, and rendering to validate before-and-after metrics.

How do I stop layout thrashing and janky rendering in my web application?

Stop layout thrashing and janky rendering by identifying rendering hotspots, minimizing layout recalculations, and implementing GPU-friendly animations to improve runtime responsiveness and verify smoothness with real-device metrics.

What is the best way to reduce frontend bundle size and network payload?

Reduce frontend bundle size and network payload by analyzing JavaScript, CSS, and font dependencies, identifying heavy contributors, and applying targeted optimizations to shrink overall weight while verifying network efficiency improvements.

Can I use this approach to diagnose UI performance issues without prior profiling data?

You can diagnose UI performance issues without prior profiling data because the approach requires systematic measurement of Core Web Vitals, load time, bundle size, and runtime behavior as the first step to identify the primary bottlenecks accurately.

Does UI performance optimization work for both loading speed and animation responsiveness?

UI performance optimization works for both loading speed and animation responsiveness by targeting improvements across network payloads, rendering, and GPU-friendly animations, ensuring measurable fixes for loading, runtime, and visual smoothness.