optimize

Diagnose and fix UI performance issues in web applications.

Updated Apr 18, 2026

Search Tags:#ui #performance #rendering #animations #optimize #web #loading

Ready to run

npx skills add https://github.com/rattamnoon/our-third-story --skill optimize-rattamnoon

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: optimize
Source: https://github.com/rattamnoon/our-third-story/tree/main/.agents/skills/optimize
Command: npx skills add https://github.com/rattamnoon/our-third-story --skill optimize-rattamnoon

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

Bottleneck diagnosis: Measure Core Web Vitals and runtime performance to identify performance hotspots.
Targeted optimizations: Apply code-splitting, lazy loading, image optimization, CSS refinement, and animation tuning.
Use Case: When a page feels sluggish on mobile, quickly pinpoint and fix laggy interactions to restore smoothness.

Quick Start

Identify the top bottlenecks, run a performance audit, and implement the recommended fixes to improve perceived speed.

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 application loading speed and janky rendering?▼

Reduce web app bundle size through code-splitting and lazy loading. These targeted optimizations defer loading non-critical JavaScript until needed, directly improving loading speed and runtime performance metrics.

What is the best way to diagnose UI performance issues on mobile web pages?▼

Diagnose mobile UI performance issues by measuring Core Web Vitals and runtime performance. Pinpointing laggy interactions and performance hotspots allows you to apply targeted fixes for a smoother mobile experience.

How do I measure and optimize Core Web Vitals for a faster app?▼

Measure Core Web Vitals to identify loading speed and rendering bottlenecks. Apply targeted optimizations to image delivery, CSS refinement, and animation tuning to meet performance requirements and improve perceived speed.

How do I optimize web animations to stop laggy page interactions?▼

Optimize web animations by tuning rendering performance to eliminate laggy interactions. Diagnose UI performance bottlenecks to pinpoint janky frames, then apply targeted fixes to restore smooth, responsive interactions.

Can I use code-splitting and image optimization to fix sluggish web app performance?▼

Use code-splitting and image optimization to fix sluggish web app performance. These targeted optimizations reduce bundle size and improve asset delivery, directly resolving slow loading speed and rendering bottlenecks.