optimize

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

1|1|Updated Feb 6, 2026
One-click install
npx skills add https://github.com/joncoronel/skillstack --skill optimize-joncoronel
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: optimize
Source: https://github.com/joncoronel/skillstack/tree/main/.agents/skills/optimize
Command: npx skills add https://github.com/joncoronel/skillstack --skill optimize-joncoronel

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Diagnoses and fixes UI performance issues 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 (LCP, FID/INP, CLS), load and interactive times, bundle size, and runtime performance to identify bottlenecks.
  • Systematic optimization: outline an actionable plan for image optimization, code-splitting, lazy loading, CSS/Font optimizations, and rendering improvements.
  • Use Case: When users report slow page loads or stutters, apply a structured audit and apply targeted improvements to reach faster, smoother interactions.

Quick Start

Run a structured performance audit on the current UI and apply the recommended optimizations.

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 and rendering issues?

Fix slow web app loading and rendering by running a structured performance audit to measure Core Web Vitals, identify bottlenecks, and implement targeted image, bundle size, and rendering optimizations for smoother interactions.

What are Core Web Vitals and how do they impact frontend performance optimization?

Core Web Vitals like LCP, FID/INP, and CLS are metrics that measure loading speed, interactivity, and visual stability. You need them to establish a performance baseline and identify specific UI bottlenecks to optimize.

How do I reduce large bundle size and eliminate UI jank on mobile and desktop?

Reduce large bundle size and eliminate UI jank by applying code-splitting, lazy loading, and CSS optimizations. This systematic approach targets rendering bottlenecks across both mobile and desktop web apps to improve runtime performance.

Does this UI performance approach work for both mobile and desktop web apps?

Yes, this UI performance approach works for both mobile and desktop web apps. It systematically diagnoses and fixes loading speed, rendering, animations, and bundle size issues across different platforms to deliver faster user experiences.

What's the best way to systematically optimize frontend images and animations?

The best way to optimize frontend images and animations is following a structured audit plan that applies image optimization, lazy loading, and rendering improvements based on measured Core Web Vitals to eliminate stutters and reduce load times.