skills.rest
Lin-0096
Lin-0096COMMUNITY
Explore all skills by this author →
GitHub

optimize

Diagnose and fix UI performance issues in web applications.

Updated Mar 22, 2026
Search Tags:#ui#performance#optimize#web#bundle-size#core-web-vitals#loading-time
One-click install
npx skills add https://github.com/Lin-0096/welove --skill optimize-lin-0096
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: optimize
Source: https://github.com/Lin-0096/welove/tree/main/.claude/skills/optimize
Command: npx skills add https://github.com/Lin-0096/welove --skill optimize-lin-0096

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Diagnoses and fixes UI performance across loading speed, rendering, animations, images, and bundle size to deliver faster, smoother user experiences.

Core Features & Use Cases

  • Performance assessment: Measure Core Web Vitals, load time, bundle size, runtime performance, and network metrics to identify bottlenecks.
  • Systematic optimization strategy: Guidance across loading, rendering, animation, and network to reduce frictions.
  • Use Case: Imagine a slow React app; apply the plan to progressively optimize critical paths and deliver a smoother experience.

Quick Start

Begin by measuring Core Web Vitals and follow the step-by-step optimization plan to improve load times and perceived performance.

Frequently Asked Questions about optimize

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

FAQPage Schema
How do I fix slow web app loading times and reduce jank during interactions?▼

Diagnose UI performance issues by measuring Core Web Vitals to identify bottlenecks in loading, rendering, and animations, then apply guided optimizations to reduce bundle size and improve runtime performance.

What is the best way to measure and improve Core Web Vitals for a slow React app?▼

The best way to improve Core Web Vitals is to measure load time, bundle size, and runtime metrics first, then progressively optimize critical rendering paths and heavy assets to deliver a smoother user experience.

Can I use this optimization process for both mobile and desktop web applications?▼

Yes, you can use this UI performance optimization process for both mobile and desktop web applications to diagnose slow load times, large bundles, and heavy assets across loading and rendering.

How do I reduce large bundle size and heavy assets in my web application?▼

Reduce large bundle size by following a systematic optimization strategy that identifies network bottlenecks and heavy assets, applying guided optimizations with clear guardrails to minimize loading frictions.

Why does my web app have poor perceived performance and how do I diagnose it?▼

Poor perceived performance occurs when loading, rendering, or animations create frictions; diagnose it by measuring Core Web Vitals and runtime metrics to pinpoint bottlenecks before applying targeted optimizations.

Related Skills

Explore More Software Engineering Skills→
DanialHaseebDanialHaseeb

optimize

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

Community
Advanced
julianromlijulianromli

optimize

Diagnose and fix web UI performance issues across loading, rendering, and animations.

Community
Advanced
DaFumDaFum
1

perf-budget-enforcer

Enforce performance budgets for bundle size, load time, and FPS in CI builds.

Community
Intermediate
trydyddtrydydd

i-optimize

Diagnose and fix UI performance bottlenecks in web apps.

Community
Advanced