performance

Measure Core Web Vitals and audit frontend performance bottlenecks.

3|Updated May 28, 2026

Search Tags:#performance #frontend #lighthouse #code-splitting #web-vitals #bundle-size

Ready to run

npx skills add https://github.com/mahg-es/araya --skill performance-mahg-es

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: performance
Source: https://github.com/mahg-es/araya/tree/main/skills/performance
Command: npx skills add https://github.com/mahg-es/araya --skill performance-mahg-es

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Slow applications cost conversions; measuring performance with real metrics and applying optimizations delivers measurable Core Web Vitals improvements across devices and teams.

Core Features & Use Cases

Measurement & Benchmarking: measure Core Web Vitals (LCP, FID, CLS) and set performance budgets.
Bottleneck Identification: locate heavy scripts, render-blocking resources, and inefficient assets.
Optimization Guidance: provide actionable steps (code-splitting, lazy loading, image optimization, caching) to improve load times and interactivity.
Use Case: Use this skill during development or post-release to drive performance improvements before launch or after reported slowdowns.

Quick Start

Audit the frontend build to surface bottlenecks and apply recommended optimizations to improve perceived performance.

Frequently Asked Questions about performance

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

FAQPage Schema

How do I identify frontend performance bottlenecks using Core Web Vitals?▼

Identify frontend performance bottlenecks by measuring Core Web Vitals like LCP, FID, and CLS to locate heavy scripts, render-blocking resources, and inefficient assets that degrade load times and interactivity.

What is the best way to reduce bundle size and speed up web application loading?▼

The best way to reduce bundle size and speed up loading is by applying code-splitting, lazy loading, and deferring unused scripts to minimize initial payload and improve perceived performance.

Can I set performance budgets and audit results across different network profiles?▼

Yes, you can set performance budgets and audit frontend results across development, testing, and production monitoring on any device and network profile to ensure Core Web Vitals targets are met.

Why does my Lighthouse score drop and how do I fix render-blocking resources?▼

Your Lighthouse score drops due to render-blocking resources and heavy assets; fix them by enabling code-splitting, optimizing images, and applying caching to improve load times and interactivity.

When do I need to optimize images and defer unused scripts for web performance?▼

You need to optimize images and defer unused scripts during development or post-release when reported slowdowns occur, ensuring performance targets are met before launch or after identifying bottlenecks.