performance

Analyze web performance with Lighthouse audits and implement optimization strategies.

Updated Mar 11, 2018

Search Tags:#performance #lighthouse #resource optimization #core web vitals #web optimization #loading speed

Ready to run

npx skills add https://github.com/jorgegvalencia/dotfiles --skill performance-jorgegvalencia

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: performance
Source: https://github.com/jorgegvalencia/dotfiles/tree/main/gemini/skills/performance
Command: npx skills add https://github.com/jorgegvalencia/dotfiles --skill performance-jorgegvalencia

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill addresses slow website loading times and poor user experience by identifying and resolving performance bottlenecks.

Core Features & Use Cases

Bottleneck Identification: Pinpoints issues in code, assets, and server response.
Optimization Strategies: Provides actionable code examples for critical rendering path, image, font, and script optimization.
Performance Budgeting: Defines clear targets for resource sizes and load times.
Use Case: Improve your website's Lighthouse score and Core Web Vitals by implementing the suggested optimizations for faster loading and a smoother user journey.

Quick Start

Optimize the performance of the website located at https://example.com.

Frequently Asked Questions about performance

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

FAQPage Schema

How do I improve my website's Lighthouse score and Core Web Vitals?▼

Improve web performance by identifying bottlenecks in code, assets, and server response, then applying actionable strategies for resource optimization, script loading, and caching to boost loading speed and runtime efficiency.

What is the best way to optimize third-party scripts for loading speed?▼

The best way to optimize third-party scripts for loading speed is to defer their execution, lazy-load non-essential resources, and establish a strict performance budget to limit their impact on the critical rendering path.

How do I identify performance bottlenecks affecting my website's runtime efficiency?▼

Identify performance bottlenecks by auditing server response times, analyzing asset delivery, and reviewing JavaScript execution to pinpoint specific issues degrading runtime efficiency and overall loading speed.

Can I define a performance budget for resource sizes and load times?▼

Yes, you can define a performance budget by setting clear targets for maximum resource sizes and acceptable load times, ensuring your web optimization strategies maintain strict limits on JavaScript, images, and fonts.

Does optimizing the critical rendering path require specific server configurations?▼

Optimizing the critical rendering path primarily focuses on prioritizing visible content delivery, inlining critical CSS, and deferring JavaScript, rather than relying on specific server configurations or environmental dependencies.

Why does my website still load slowly after compressing images and fonts?▼

Your website may still load slowly due to unoptimized JavaScript execution, render-blocking third-party scripts, or poor caching strategies, requiring a comprehensive audit of the entire critical rendering path.