How does it help with UI smoothness?

It identifies layout thrashing and provides CSS and JavaScript patterns that leverage GPU acceleration to ensure animations run at a smooth 60fps.

What performance metrics does the Optimize skill focus on?

It focuses on Core Web Vitals (LCP, FID/INP, CLS), bundle size, runtime frame rates, and network payload sizes.

Can it help reduce my website's loading time?

Absolutely. It provides patterns for image compression, lazy loading, font optimization, and utilizing CDNs to significantly decrease initial load times.

Does this skill work with modern frameworks like React?

Yes, it includes specific strategies for React such as useMemo, useCallback, component virtualization, and route-based code splitting.

Performance & UI Optimizer

Name: Performance & UI Optimizer
Author: Moliboy5000

byMoliboy5000

0•

设计工具

Optimizes web interface performance across loading speeds, rendering efficiency, animations, and asset delivery.

Performance & UI Optimizer is a specialized skill for Claude Code designed to audit and enhance web application speed and responsiveness. It provides a systematic approach to identifying performance bottlenecks—from oversized JavaScript bundles and unoptimized images to layout thrashing—and offers actionable implementation patterns for Core Web Vitals. Whether you are building in React or vanilla JS, this skill helps you implement code-splitting, GPU-accelerated animations, and efficient asset-loading strategies to ensure your application remains fluid and fast across all devices and network conditions.

主要功能

01Rendering performance tuning to eliminate layout thrashing

02Core Web Vitals assessment and improvement strategies

03JavaScript bundle reduction via code-splitting and tree-shaking

040 GitHub stars

05Framework-specific patterns for React memoization and virtualization

06Automated guidance for image, font, and CSS optimization

使用场景

01Improving Largest Contentful Paint (LCP) and CLS scores for SEO and user retention

02Reducing initial load times for users on limited mobile data or slow connections

03Fixing UI 'jank' and stuttering in complex web animations and transitions

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add moliboy5000/.claude optimize

For use in Claude.ai and ChatGPT