optimize

Diagnose web front-end performance issues and recommend optimizations.

5|Updated Mar 27, 2026
One-click install
npx skills add https://github.com/Gyanano/Bower --skill optimize-gyanano
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: optimize
Source: https://github.com/Gyanano/Bower/tree/main/.agents/skills/optimize
Command: npx skills add https://github.com/Gyanano/Bower --skill optimize-gyanano

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This skill eliminates sluggish, laggy, and janky interfaces by guiding you through a full diagnosis of loading, rendering, animation, and bundle inefficiencies so you can deliver faster, smoother experiences.

Core Features & Use Cases

  • Performance Diagnosis: Measure Core Web Vitals, load time, bundle size, runtime metrics, and network payloads to surface the true bottlenecks.
  • Targeted Optimizations: Apply best practices for images, fonts, scripts, animations, and rendering to reduce payloads, reflows, and long tasks.
  • Use Case: When the homepage load time spikes, gather recorded metrics, isolate culpable assets, and plan incremental changes that prove faster interactions.

Quick Start

Diagnose homepage load stalls and recommend fixes.

Frequently Asked Questions about optimize

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

FAQPage Schema
How do I diagnose slow web front-end rendering and poor Core Web Vitals?

Diagnose slow web front-end rendering by measuring Core Web Vitals, resource loads, runtime stress, and network payloads to surface true bottlenecks. The skill isolates specific loading, rendering, and animation inefficiencies causing poor load times.

What is the best way to reduce heavy JavaScript bundle size and long tasks?

The best way to reduce heavy JavaScript bundle size is by measuring network payloads and runtime metrics, then applying targeted bundling, image, font, and script optimizations to eliminate long tasks and reflows.

How do I fix janky UI animations and reflows in a web application?

Fix janky UI animations and reflows by applying rendering optimizations that reduce layout shifts and long tasks. Measure runtime stress before and after to ensure smoother interactions and improved Core Web Vitals.

Can I use this to isolate which assets are causing homepage load time spikes?

Yes, you can isolate which assets are causing homepage load time spikes. The skill gathers recorded metrics for resource loads and network payloads, isolates culpable assets, and recommends incremental changes to prove faster interactions.

What front-end optimization techniques are recommended for slow loading images and fonts?

Recommended front-end optimization techniques for slow loading images and fonts include applying targeted image and font optimizations. These reduce payloads and network bottlenecks, directly improving loading performance and Core Web Vitals.

When should I not use lazy-loading for rendering optimization?

Metadata does not specify exact scenarios to avoid lazy-loading. However, it emphasizes measuring runtime stress and resource loads before and after applying any rendering optimization to validate actual performance improvements.