skills.rest
Youneslahlali
YouneslahlaliCOMMUNITY
Explore all skills by this author →
GitHub

optimize

Analyze web performance metrics and implement optimization strategies for Core Web Vitals.

Updated Feb 12, 2026
Search Tags:#performance#web vitals#optimization#bundle size#rendering#animations#loading speed
One-click install
npx skills add https://github.com/Youneslahlali/MyWebsite --skill optimize-youneslahlali
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: optimize
Source: https://github.com/Youneslahlali/MyWebsite/tree/main/.gemini/skills/optimize
Command: npx skills add https://github.com/Youneslahlali/MyWebsite --skill optimize-youneslahlali

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill addresses slow loading times, janky animations, and large bundle sizes that degrade user experience and impact conversion rates.

Core Features & Use Cases

  • Performance Auditing: Identifies bottlenecks in loading, rendering, and animations.
  • Optimization Strategies: Provides actionable steps for images, JavaScript, CSS, and network requests.
  • Core Web Vitals Improvement: Focuses on LCP, FID/INP, and CLS to enhance user-perceived speed.
  • Use Case: A website's LCP is too high due to a large hero image. This Skill can guide the developer to compress the image, use a modern format like WebP, and implement lazy loading.

Quick Start

Optimize the website's loading speed by compressing all images and implementing lazy loading for below-the-fold content.

Frequently Asked Questions about optimize

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

FAQPage Schema
How do I improve my website's Core Web Vitals scores?▼

Improve Core Web Vitals by systematically addressing loading speed, rendering, and animations through image compression, lazy loading, and bundle size reduction to enhance LCP, FID/INP, and CLS scores.

What is the best way to reduce web bundle size and fix slow loading speed?▼

Reduce bundle size and loading speed by applying optimization strategies for JavaScript, CSS, and network requests, while compressing images into modern formats and implementing lazy loading for below-the-fold content.

Why does my web interface have janky animations and how can I optimize rendering?▼

Janky animations and rendering bottlenecks are fixed by auditing performance metrics and implementing best practices across rendering and animations to ensure smooth user experiences and faster interface responses.

How do I optimize hero images to lower high LCP scores on my website?▼

Lower high LCP by compressing large hero images, converting them to modern formats like WebP, and implementing lazy loading to systematically address loading speed issues and improve user-perceived speed.

Can I use performance auditing strategies for both images and network requests?▼

Performance auditing strategies cover images, JavaScript, CSS, fonts, and network requests, providing actionable optimization steps to identify bottlenecks and implement best practices across all these web interface areas.

Related Skills

Explore More Software Engineering Skills→
JochenYangJochenYang
21

performance-optimizer

Identify performance bottlenecks and optimize application speed across backend, database, and frontend workflows.

Community
Intermediate
danielzmeowdanielzmeow

optimize

Analyze and resolve web performance bottlenecks in Core Web Vitals and JavaScript execution.

Community
Advanced
patrickhaahrpatrickhaahr

vercel-react-best-practices

Identify and apply React/Next.js performance best practices for rendering, data fetching, and bundle size.

Community
Basic
guillermoscriptguillermoscript
21

optimize

Analyzes web page loads and recommends optimizations for faster performance.

Community
Advanced