skills.rest
Tea-4-Life
Tea-4-LifeOFFICIAL
Explore all skills by this author →
GitHub

optimize

Identify and fix front-end performance issues with before/after measurements.

Updated Jan 25, 2026
Search Tags:#performance#frontend#optimize#web#loading#bundle-size#core-web-vitals
One-click install
npx skills add https://github.com/Tea-4-Life/Tea4Life-Frontend-Website --skill optimize-tea-4-life
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: optimize
Source: https://github.com/Tea-4-Life/Tea4Life-Frontend-Website/tree/main/.agents/skills/optimize
Command: npx skills add https://github.com/Tea-4-Life/Tea4Life-Frontend-Website --skill optimize-tea-4-life

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Identify and fix performance issues to create faster, smoother user experiences.

Core Features & Use Cases

  • Assess performance issues by measuring Core Web Vitals, load time, bundle size, and runtime performance.
  • Provide an optimization strategy across loading, rendering, animation, and network performance.
  • Apply a systematic improvement plan with measurable before/after results.

Quick Start

Identify bottlenecks in your app and begin applying targeted optimizations that improve perceived performance.

Frequently Asked Questions about optimize

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

FAQPage Schema
How do I identify and fix front-end performance issues like poor Core Web Vitals?▼

To fix front-end performance issues, measure Core Web Vitals like LCP, INP, and CLS to identify bottlenecks, then apply a systematic optimization plan targeting loading speed, rendering, and bundle size with validated before and after results.

What's the best way to reduce web app bundle size and improve loading speed?▼

The best way to reduce bundle size and improve loading speed is applying code-splitting and CSS optimization techniques. This systematically targets network performance and loading bottlenecks to deliver faster perceived web experiences.

How do I optimize images and font loading to improve LCP and FCP scores?▼

Optimize images and font loading by applying targeted improvements within a systematic performance strategy. This directly addresses rendering and loading bottlenecks to improve LCP and FCP Core Web Vitals measurements.

Can I use this approach to assess runtime performance and rendering animations?▼

Yes, you can assess runtime performance and rendering animations. The approach evaluates loading, rendering, and animation performance across web apps, providing a comprehensive optimization strategy with measurable before and after results.

Why does my web app have a high INP score and how do I optimize it?▼

A high INP score indicates runtime rendering or interaction bottlenecks. Optimize it by measuring Core Web Vitals to identify issues, then applying code-splitting and CSS optimization to improve runtime performance.

Related Skills

Explore More Software Engineering Skills→
ajsai47ajsai47
11

benchmark

Detect web performance regressions from cumulative code changes across pull requests.

Community
Advanced
JoniSirvioJoniSirvio

optimize

Measure Core Web Vitals and implement targeted optimizations for web and mobile interfaces.

Community
Advanced
guillermoscriptguillermoscript
21

optimize

Analyzes web page loads and recommends optimizations for faster performance.

Community
Advanced
AceCandyAceCandy

optimize

Diagnose and fix UI performance bottlenecks in React front ends.

Community
Advanced