skills.rest
ev3rlit
ev3rlitCOMMUNITY
Explore all skills by this author →
GitHub

optimize

Diagnose UI performance bottlenecks and prescribe optimization steps for web apps.

Updated Apr 2, 2026
Search Tags:#performance#frontend#optimization#rendering#web-vitals#bundle-size#load-time
One-click install
npx skills add https://github.com/ev3rlit/magam-canonical-archive --skill optimize-ev3rlit
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: optimize
Source: https://github.com/ev3rlit/magam-canonical-archive/tree/main/.claude/skills/optimize
Command: npx skills add https://github.com/ev3rlit/magam-canonical-archive --skill optimize-ev3rlit

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Diagnoses and fixes UI performance across loading speed, rendering, animations, images, and bundle size. Use when the user mentions slow, laggy, janky, performance, bundle size, load time, or wants a faster, smoother experience.

Core Features & Use Cases

  • Measure Core Web Vitals (LCP, FID/INP, CLS) and performance budgets to establish baselines.
  • Identify bottlenecks across loading, rendering, animations, and network usage to prioritize fixes.
  • Propose and apply deterministic optimization strategies (image optimization, code-splitting, lazy loading, CSS optimization, and resource prioritization).

Quick Start

Run a quick performance audit and apply a targeted optimization pass to improve load times and interactivity.

Frequently Asked Questions about optimize

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

FAQPage Schema
How do I diagnose and fix slow web app loading and janky rendering?▼

To fix slow web app loading and janky rendering, profile Core Web Vitals like LCP and CLS to establish baselines, identify bottlenecks, and apply deterministic steps such as code-splitting and lazy loading.

What's the best way to reduce frontend bundle size and improve load time?▼

The best way to reduce frontend bundle size and improve load time is by implementing code-splitting, lazy loading, and image optimization, directly targeting heavy scripts that delay initial paint.

How does measuring Core Web Vitals help increase UI interactivity?▼

Measuring Core Web Vitals helps increase UI interactivity by quantifying metrics like FID or INP, allowing you to profile rendering bottlenecks and prescribe targeted optimizations for smoother animations.

Does this performance optimization approach work for both web and mobile apps?▼

Yes, this performance optimization approach works for both web and mobile apps, diagnosing heavy scripts and slow initial paint to apply targeted fixes across loading speed and rendering.

Why does my web app still have janky animations after reducing bundle size?▼

Your web app still has janky animations because reducing bundle size alone does not fix rendering bottlenecks; you must also optimize CSS and prioritize resources to increase interactivity.

Related Skills

Explore More Software Engineering Skills→
Gekkos-techGekkos-tech
4

core-web-vitals

Optimize LCP, INP, and CLS metrics for web pages.

Official
Intermediate
liauw-medialiauw-media
3

lighthouse-performance-optimization

Run Lighthouse audits through MCP to identify website performance bottlenecks.

Community
Advanced
andronicsandronics
1

performance-analyzer

Analyze CSS performance bottlenecks and deliver optimization strategies.

Community
Advanced
SylphxAISylphxAI
4

performance

Analyze Next.js frontend performance for Core Web Vitals and bundle size.

Official
Intermediate