optimize

Identify and fix web performance issues with measurable before/after validation.

Updated Mar 7, 2026
One-click install
npx skills add https://github.com/trieloff/trrrrdt --skill optimize-trieloff
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: optimize
Source: https://github.com/trieloff/trrrrdt/tree/main/.claude/skills/optimize
Command: npx skills add https://github.com/trieloff/trrrrdt --skill optimize-trieloff

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Improve interface performance across loading speed, rendering, animations, images, and bundle size. Makes experiences faster and smoother.

Core Features & Use Cases

  • Assess Performance Issues: Understand current performance, measure Core Web Vitals (LCP, FID/INP, CLS), load times, bundle size, runtime performance, and network metrics; identify bottlenecks and prioritize fixes.
  • Optimization Strategy: Create a systematic plan addressing loading, rendering, animation, and network optimizations; include concrete techniques, metrics, and validated steps for reuse.
  • Core Web Vitals Optimization: Target LCP under 2.5s, reduce FID/INP, and CLS; optimize images, CSS, JS, fonts, and server delivery; implement caching and preloading strategies.
  • Rapid Start & Validation: Apply changes incrementally, measure before/after, and verify performance gains across devices and networks.
  • Code samples and practical guidelines like lazy loading, code-splitting, and critical CSS inline can be included to guide implementation.

Quick Start

Run a quick performance audit and begin implementing targeted optimizations on a web app.

Frequently Asked Questions about optimize

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

FAQPage Schema
How do I optimize Core Web Vitals like LCP, CLS, and INP for my web app?▼

To optimize Core Web Vitals, measure baseline metrics, then apply targeted fixes like image optimization, critical CSS inlining, and code-splitting to achieve LCP under 2.5s and reduce CLS and INP.

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

The best way to reduce bundle size and improve loading speed is implementing code-splitting, lazy loading assets, and optimizing delivery to streamline the critical rendering path.

How do I identify and fix web rendering bottlenecks?▼

Identify rendering bottlenecks by auditing runtime performance and network metrics, then fix them by optimizing animations, minimizing main-thread blocking, and streamlining the critical rendering path.

Can I systematically validate web performance improvements across devices?▼

You can systematically validate web performance improvements by applying changes incrementally, measuring before and after benchmarks, and verifying performance gains across various devices and network conditions.

When do I need to implement code-splitting and lazy loading for web performance?▼

You need to implement code-splitting and lazy loading when initial bundle size negatively impacts loading speed, causing delayed interactivity and poor Core Web Vitals scores during user navigation.

What is a critical rendering path optimization strategy for smoother UX?▼

A critical rendering path optimization strategy systematically addresses loading and rendering by prioritizing above-the-fold content, inlining critical CSS, and deferring non-essential JavaScript to create a smoother UX.