optimize

Identify and fix performance bottlenecks in web and Electron interfaces.

1|Updated May 6, 2026

Search Tags:#performance #frontend #lighthouse #optimize #web #bundle-size

Ready to run

npx skills add https://github.com/yckkkk/reo --skill optimize-yckkkk

💬 Prompt for ChatGPT / Claude Chat▼

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

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Performance bottlenecks in UI and interactions often degrade user experience; this Skill provides a structured approach to identify and fix them to deliver faster, smoother interfaces.

Core Features & Use Cases

Identify bottlenecks across loading, rendering, and interactions.
Prioritize optimizations (images, bundles, CSS, and code-splitting) with measurable impact.
Use cases include improving initial load, interactive responsiveness, and animation frame rates in web and Electron apps.

Quick Start

Run a baseline performance audit and implement targeted optimizations on the slowest paths to see measurable gains.

Frequently Asked Questions about optimize

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

FAQPage Schema

How do I identify web performance bottlenecks affecting Core Web Vitals?▼

To identify web performance bottlenecks, you must measure baseline benchmarks like Core Web Vitals, TTI, and LCP. This targets slow loading and rendering paths to pinpoint exactly where optimizations are needed for smoother interfaces.

What's the best way to reduce bundle size in an Electron app?▼

The best way to reduce bundle size is implementing code-splitting and image optimization. This directly targets bundle size and CSS improvements to ensure faster initial loads and interactive responsiveness across web and Electron apps.

How does code-splitting improve frontend loading performance?▼

Code-splitting improves frontend loading performance by dividing bundles into smaller chunks. This prioritizes critical assets for initial load, significantly improving Largest Contentful Paint and Time to Interactive metrics.

Can I use Lighthouse metrics to prevent performance regressions?▼

Yes, you can use Lighthouse metrics to prevent regressions by establishing guardrails. This requires measurable benchmarks like Core Web Vitals to monitor loading and rendering, ensuring optimizations do not degrade over time.

Why does my web interface have poor animation frame rates?▼

Poor animation frame rates usually stem from rendering bottlenecks in CSS or JavaScript. Identifying these bottlenecks allows you to target CSS improvements and code-splitting to deliver smoother, faster interactive experiences.