optimize

Diagnose and fix UI performance bottlenecks in web apps.

Updated Aug 27, 2026

Search Tags:#lighthouse #optimize #performance-testing #code-splitting #bundle-size #core-web-vitals #ui-performance

Ready to run

npx skills add https://github.com/robertsthomas/hellobrand --skill optimize-robertsthomas

💬 Prompt for ChatGPT / Claude Chat▼

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

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 and optimize Core Web Vitals (LCP, FID/INP, CLS), time to interactive, and total blocking time.
Identify bottlenecks in loading, rendering, and network to propose targeted fixes.
Implement systematic optimizations (images/assets, JavaScript/CSS splitting, caching, and fonts) and validate improvements with before/after metrics.

Quick Start

Audit the current UI performance to identify the top bottleneck affecting perceived speed.

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 rendering performance?▼

To diagnose and fix slow web app loading and rendering performance, audit Core Web Vitals like LCP, FID/INP, and CLS to identify bottlenecks. Propose a structured plan implementing image, asset, JavaScript, and CSS optimizations, validating improvements with before and after metrics.

What is the best way to reduce JavaScript bundle size and improve UI performance?▼

The best way to reduce JavaScript bundle size and improve UI performance is applying systematic code splitting and caching strategies. Measure total blocking time and time to interactive, then implement targeted CSS and JavaScript optimizations to validate faster loading speed.

How do I measure Core Web Vitals to find UI performance bottlenecks?▼

You measure Core Web Vitals to find UI performance bottlenecks by auditing current loading, rendering, and network conditions. Identify top bottlenecks affecting perceived speed across mobile and desktop experiences, targeting metrics like LCP, CLS, and INP.

Can I optimize web app animations and perceived speed across varying network conditions?▼

Yes, you can optimize web app animations and perceived speed across varying network conditions. Diagnose loading, rendering, and animation bottlenecks for mobile and desktop experiences, implementing font, image, and asset optimizations to improve smoothness.

Why does my web app feel janky and laggy during user interactions?▼

Your web app feels janky and laggy during user interactions due to high total blocking time and poor Core Web Vitals. Diagnose rendering and animation bottlenecks, implement JavaScript and CSS optimizations, and validate improvements with before and after metrics.

What are the limitations of diagnosing UI performance without structured optimization?▼

Diagnosing UI performance without structured optimization limits measurable improvements in loading speed and bundle size. Without validating before and after metrics for Core Web Vitals, targeted fixes for images, assets, and code splitting remain unverified.