An AI-driven performance analyzer that generates structured optimization reports for web applications based on Lighthouse and bundle data.
Install & Download
1. ClawHub CLI
The fastest way to install a skill directly from the registry.
npx clawhub@latest install frontend-performance-audit
2. Manual Installation
Copy the skill folder to one of these locations
~/.openclaw/skills/ <project>/skills/ Priority: Workspace > Local > Bundled
3. Prompt Installation
Copy this prompt to OpenClaw to install it automatically.
Help me install frontend-performance-audit using Clawhub. If Clawhub is not installed, install it first (npm i -g clawhub).
Prefer to download?
Get the raw skill files in a ZIP archive.
What is Frontend Performance Audit?
The Frontend Performance Audit skill is a specialized diagnostic tool designed to evaluate and optimize web application speed and responsiveness. By leveraging Openclaw Skills, developers can transform complex Lighthouse metrics, network waterfalls, and bundle analysis data into clear, actionable engineering tasks. This tool is essential for teams aiming to hit performance benchmarks and improve user experience without guessing where the bottlenecks lie.
This skill focuses on delivering high-impact results by prioritizing low-effort, high-ROI improvements. It systematically checks for common issues such as render-blocking resources, oversized JavaScript bundles, and poor Core Web Vitals, ensuring that every optimization suggestion is backed by observed evidence. Integrating this into your workflow allows for a consistent and professional approach to performance management.
Frontend Performance Audit Use Cases
- Diagnosing low Lighthouse scores and failing Core Web Vitals.
- Identifying the cause of slow First Contentful Paint (FCP) and interaction lag.
- Auditing oversized bundles and identifying specific dependencies for tree-shaking.
- Generating professional performance reports for stakeholders or client handovers.
- Comparing build configurations to reduce render-blocking assets.
How Frontend Performance Audit Works
- Input Identification: The skill parses various inputs including page URLs, Lighthouse JSON reports, network HAR files, and bundle statistics.
- Metric Validation: It references internal metric standards to identify mandatory performance indicators that must be evaluated.
- Symptom Diagnosis: By applying predefined diagnosis rules, the skill matches observed performance symptoms with technical causes.
- Prioritization: Suggestions are filtered to prioritize high-revenue, low-cost modifications over heavy refactoring.
- Report Generation: A structured report is compiled using a professional template, distinguishing between hard evidence and logical inferences.
Frontend Performance Audit Setup
To start using this diagnostic tool within your environment, ensure you have the necessary reference files configured in your project root:
# Install the skill via the Openclaw CLI
openclaw add frontend-performance-audit
# Ensure reference files exist in your local path:
# references/metrics.md
# references/diagnosis-rules.md
# references/report-template.md
Frontend Performance Audit Data Schema & Taxonomy
The skill organizes audit data and metadata according to the following structure:
| Data Component | Format | Purpose |
|---|---|---|
| Input Sources | URL, JSON, HAR | Raw performance data for analysis |
| Diagnostic Rules | Markdown | Logic for matching symptoms to solutions |
| Performance Metrics | Markdown | Benchmarks for FCP, LCP, CLS, and TBT |
| Audit Report | Markdown | Final structured optimization guide |
| Metadata | Taxonomy | Confidence levels and data completeness flags |
Frontend Performance Audit Advanced Features
- Evidence-Based Inference: Clearly separates observed data from hypothesized conclusions to ensure technical accuracy.
- ROI-Driven Recommendations: Automatically sorts tasks by impact-vs-effort ratio to save engineering time.
- Confidence Scoring: Reports the置信度 (confidence level) based on the completeness of provided data sources.
- Custom Template Support: Allows users to swap reference files to match specific organizational reporting standards.
- Multi-Input Correlation: Syncs Lighthouse data with network waterfall logs for a holistic view of the loading lifecycle.
SKILL.md
Loading
Related Openclaw Skills
Newsticker (claw://News)
A specialized newsdesk skill connecting OpenClaw agents to German-language AI, security, and ecosystem updates from ClawNews.de.
ClawJobs
ClawJobs is a collaboration plugin for OpenClaw that enables multiple agent peers to share tasks and synchronize status through a centralized hub.
Paper Reader
A comprehensive PDF extraction tool designed for academic researchers to parse papers into structured text, images, and data tables.
Classical Chinese Poetry AI Skill
A comprehensive AI-driven tool for generating authentic classical Chinese poetry and searching an extensive corpus of historical literary works.
Novel
A lightning-fast terminal utility for managing novel metadata, including chapters, characters, and plot timelines without leaving the command line.
Video Knowledge Ingest
A powerful cross-platform tool to transform video URLs or local files into searchable, summarized local knowledge using Whisper and yt-dlp.
Featured*
