Run any Skill in Manus with one click

aie-web-performance

Stars0

Forks0

UpdatedJuly 7, 2026 at 13:37

Audits and fixes web page load performance. Analyzes images, CSS, JavaScript, fonts, and third-party assets, then produces a prioritized before/after report with concrete optimization steps and copy-paste code. Targets Core Web Vitals (LCP, INP, CLS) and Lighthouse scores. Stack-agnostic — plain HTML, WordPress, React, Next.js, Vite, Astro, or a hosted builder; uses free tools only (Lighthouse, ImageMagick, cwebp/AVIF, PurgeCSS, bundle analyzers). Trigger on "my site is slow," "speed up my site," "improve page load," "optimize performance," "Core Web Vitals," "LCP/INP/CLS," "Lighthouse score," "reduce bundle size," "optimize images," "why is my site slow," or "performance audit."

Installation

Install with Codex or Claude Copy this prompt, paste it into Codex, Claude, or another assistant, and let it review the skill page and install it for you.

Run Skill in Manus

Source

mrhinkle

mrhinkle/aienterprise-skills

View GitHub Repository View Creator Repositories

Download

Run Skill in Manus

Related occupationsSOC

Based on SOC occupation classification

Software DevelopersComputer and Mathematical Occupations·SOC 15-1252

File Explorer

2 files

SKILL.md

readonly

name

aie-web-performance

description

Web Performance Optimizer

Find what makes a page slow, then fix it. Produce a prioritized report with real byte savings and ready-to-use code — not generic advice.

Why it matters

Speed affects conversion, bounce rate, and search ranking. Google uses Core Web Vitals as a ranking signal (https://developers.google.com/search/docs/appearance/page-experience), and field data consistently ties faster pages to higher engagement and revenue. Optimize the metrics that reflect real user experience: LCP, INP, and CLS.

When to use this skill

The user says the site feels slow, has poor Lighthouse or Core Web Vitals scores, or wants to trim page weight. Works from a live URL or from a local project directory / source files.

Inputs to gather

URL or local path to the site.
Stack if known (plain HTML, WordPress, React, Next.js, Vite, Astro, etc.) — it changes which build fixes apply.
Target devices/browsers and any specific concern (slow mobile, janky scroll, layout jump).

Audit procedure

Measure first, then attribute weight to the biggest offenders. For the full checklists and the exact commands and code snippets, read reference/optimization-guide.md.

Baseline — run Lighthouse (or read PageSpeed Insights field data) and record LCP, INP, CLS, FCP, TBT/TTI, and total transfer size. Note the LCP element specifically.
Images — usually 50-80% of page weight. Check dimensions vs. displayed size, compression, modern formats (AVIF/WebP), srcset/sizes, and lazy loading for below-the-fold images (never lazy-load the LCP image).
CSS — minification, critical-CSS inlining for above-the-fold, unused-selector removal, and avoiding layout-triggering animations (prefer transform/opacity).
JavaScript — the most expensive resource. Check bundle size, code splitting, defer/async, tree-shaking, and unnecessary polyfills. Reducing main-thread work is the main lever for INP.
Fonts — font-display: swap, preload critical fonts, subsetting, and variable fonts to replace multiple files. Prevents invisible-text delays and font-swap CLS.
Preload / preconnect / prefetch — preload the LCP resource, preconnect to critical third-party origins, prefetch likely next-page assets. Don't over-preload.
Delivery — confirm Brotli/gzip compression, HTTP/2 or HTTP/3, caching headers, and CDN use.

Core Web Vitals targets (good thresholds)

Source: https://web.dev/articles/vitals

LCP (Largest Contentful Paint) — < 2.5s
INP (Interaction to Next Paint) — < 200ms (replaced FID as a Core Web Vital in March 2024 — https://web.dev/blog/inp-cwv-launch)
CLS (Cumulative Layout Shift) — < 0.1
Supporting: FCP < 1.8s, TBT low, Lighthouse Performance 90+.

Priority of fixes

High impact (do first)

Image optimization — 30-50% byte reduction typical.
JS minification + code splitting — 20-40% reduction, big INP win.
Unused CSS removal — 20-60% reduction.
Font-display + subsetting — faster text render, less CLS.
Reserve space for images/embeds/ads (width+height or aspect-ratio) — kills CLS.

Medium impact

Critical CSS inlining, defer/async scripts, preload the LCP resource, Brotli/gzip.

Lower impact (situational)

Service-worker caching, CDN tuning, HTTP/3.

Output format

PERFORMANCE REPORT — {url}
Date: {date}

CORE WEB VITALS (before)
  LCP {x}s   INP {x}ms   CLS {x}
  Lighthouse Performance: {n}/100
  Total transfer: {x} KB   |  LCP element: {selector}

TOP BOTTLENECKS (ranked by impact)
  1. {issue} — est. saving {x} KB / {x}ms — {fix}
  ...

FIXES BY AREA
  Images    ...  (with commands/HTML)
  CSS       ...
  JavaScript...
  Fonts     ...
  Delivery  ...

PROJECTED AFTER
  LCP ~{x}s   INP ~{x}ms   CLS ~{x}   (state assumptions)

VERIFICATION
  Re-run Lighthouse; confirm field data in PageSpeed Insights / CrUX after ~28 days.

Guardrails

Optimizations must preserve functionality — flag anything that could change behavior.
Field data (real users, CrUX) is the source of truth; lab data (Lighthouse) is a proxy. Say which one a number comes from.
Don't invent savings numbers — label estimates as estimates and show the reasoning.
All recommended tools are free: Lighthouse CLI, ImageMagick, cwebp/avifenc, PurgeCSS, and framework bundle analyzers.

More from this repository

same repository

aie-skill-creator

mrhinkle/aienterprise-skills

Build a new, high-quality Claude Agent Skill from scratch — the right frontmatter, a tight SKILL.md, progressive-disclosure reference files, a self-test, and packaging as a .skill zip or a plugin/marketplace entry. Also improves or audits an existing skill against a quality rubric, and fixes descriptions that don't trigger reliably. Trigger on "create a skill," "make a skill," "build a skill for X," "turn this workflow into a skill," "write a SKILL.md," "improve this skill," "audit my skill," "why doesn't my skill trigger," or "package this skill."

2026-07-070

aie-web-testing

mrhinkle/aienterprise-skills

Write and run automated browser tests for a web app using Playwright — smoke tests, critical user journeys (sign-up, login, contact/checkout forms), navigation, and console/network-error checks — then report pass/fail with screenshots and repro steps. Scaffolds Playwright if the project doesn't have it, uses resilient role/text selectors, and can wire tests into CI. Complements a manual QA pass with real automation. Works with any stack the browser can load (React, Next.js, Vue, Svelte, plain HTML, WordPress). Trigger on "write tests for my site," "add Playwright tests," "test this user flow," "end-to-end tests," "e2e," "browser tests," "test my signup/checkout," or "set up automated testing."

2026-07-070

ai-slop-killer

mrhinkle/aienterprise-skills

The final anti-AI-slop editing pass for any drafted or revised prose — blog posts, newsletters, LinkedIn/social, emails, marketing and web copy, documentation, essays, fiction. Detects documented AI writing tells (negative parallelism "not X, it's Y," rhetorical Q&A, rule-of-three and anaphora pile-ups, em-dash and unicode overuse, corporate-AI vocabulary, wind-up intros and signposted conclusions, bold-first-bullet listicles, low-burstiness rhythm, hedging, vague attributions, participial "-ing" filler, grandiose stakes, invented concept labels), scores the passage, rewrites in place, and reports what it caught. Runs LAST, after any other writing or editing skill. Trigger on "clean this," "de-slop," "kill the AI slop," "copyedit," "does this sound like AI," "make this sound human," "humanize this," or automatically after any skill produces prose meant to be published.

2026-07-070

aie-chief-of-staff

mrhinkle/aienterprise-skills

Your morning chief of staff. Pulls together a single prioritized daily brief from your calendar, your inbox (read-only triage), and a fresh scan of your industry news and tracked competitors. Flags what needs prep, who's waiting on a reply, schedule conflicts and focus time, and the outside news that actually matters to you today. Fully configurable per person and industry via cos.config.md (industry, competitors, keywords, VIPs, sources, working hours). Read-only and safe by default — it drafts and recommends, it never sends, accepts, or deletes without your say-so. Trigger on "run my chief of staff," "morning briefing," "brief me," "daily brief," "what's on my plate today," "catch me up," "start my day," or "prep my day."

2026-07-070

aie-social-linkedin

mrhinkle/aienterprise-skills

Produce a high-quality, research-backed LinkedIn post (or short series) on any topic for any brand or person. Runs a real research phase to gather facts and citable sources, drafts using proven LinkedIn structures (strong first-line hook, skimmable body, one clear idea, concrete takeaway), enforces that every factual claim is source-backed, self-reviews against a quality rubric, and finishes with the ai-slop-killer pass. Outputs the post plus 2-3 alternative hooks. Trigger on "write a LinkedIn post," "draft a LinkedIn post about X," "turn this into a LinkedIn post," "make a LinkedIn post," "LinkedIn post from this article," or "repurpose this for LinkedIn."

2026-07-070

aie-social-x

mrhinkle/aienterprise-skills

Produce a high-quality X (Twitter) post or thread on any topic for any brand or person. Researches the topic to gather facts and citable sources, decides single-post vs thread, drafts a scroll-stopping hook and one-idea-per-post body tuned to X's character limits and 2026 algorithm, backs every factual claim with a source, self-reviews against a quality rubric, and finishes with the ai-slop-killer pass. Outputs the post/thread plus 2-3 alternative hooks. Trigger on "write an X post," "make a thread," "draft a tweet," "turn this into a thread," "X thread about X," "post this on X," or "repurpose this for Twitter/X."

2026-07-070

name

aie-web-performance

description

Web Performance Optimizer

Find what makes a page slow, then fix it. Produce a prioritized report with real byte savings and ready-to-use code — not generic advice.

Why it matters

When to use this skill

The user says the site feels slow, has poor Lighthouse or Core Web Vitals scores, or wants to trim page weight. Works from a live URL or from a local project directory / source files.

Inputs to gather

URL or local path to the site.
Stack if known (plain HTML, WordPress, React, Next.js, Vite, Astro, etc.) — it changes which build fixes apply.
Target devices/browsers and any specific concern (slow mobile, janky scroll, layout jump).

Audit procedure

Measure first, then attribute weight to the biggest offenders. For the full checklists and the exact commands and code snippets, read reference/optimization-guide.md.

Baseline — run Lighthouse (or read PageSpeed Insights field data) and record LCP, INP, CLS, FCP, TBT/TTI, and total transfer size. Note the LCP element specifically.
Images — usually 50-80% of page weight. Check dimensions vs. displayed size, compression, modern formats (AVIF/WebP), srcset/sizes, and lazy loading for below-the-fold images (never lazy-load the LCP image).
CSS — minification, critical-CSS inlining for above-the-fold, unused-selector removal, and avoiding layout-triggering animations (prefer transform/opacity).
JavaScript — the most expensive resource. Check bundle size, code splitting, defer/async, tree-shaking, and unnecessary polyfills. Reducing main-thread work is the main lever for INP.
Fonts — font-display: swap, preload critical fonts, subsetting, and variable fonts to replace multiple files. Prevents invisible-text delays and font-swap CLS.
Preload / preconnect / prefetch — preload the LCP resource, preconnect to critical third-party origins, prefetch likely next-page assets. Don't over-preload.
Delivery — confirm Brotli/gzip compression, HTTP/2 or HTTP/3, caching headers, and CDN use.

Core Web Vitals targets (good thresholds)

Source: https://web.dev/articles/vitals

LCP (Largest Contentful Paint) — < 2.5s
INP (Interaction to Next Paint) — < 200ms (replaced FID as a Core Web Vital in March 2024 — https://web.dev/blog/inp-cwv-launch)
CLS (Cumulative Layout Shift) — < 0.1
Supporting: FCP < 1.8s, TBT low, Lighthouse Performance 90+.

Priority of fixes

High impact (do first)

Image optimization — 30-50% byte reduction typical.
JS minification + code splitting — 20-40% reduction, big INP win.
Unused CSS removal — 20-60% reduction.
Font-display + subsetting — faster text render, less CLS.
Reserve space for images/embeds/ads (width+height or aspect-ratio) — kills CLS.

Medium impact

Critical CSS inlining, defer/async scripts, preload the LCP resource, Brotli/gzip.

Lower impact (situational)

Service-worker caching, CDN tuning, HTTP/3.

Output format

PERFORMANCE REPORT — {url}
Date: {date}

CORE WEB VITALS (before)
  LCP {x}s   INP {x}ms   CLS {x}
  Lighthouse Performance: {n}/100
  Total transfer: {x} KB   |  LCP element: {selector}

TOP BOTTLENECKS (ranked by impact)
  1. {issue} — est. saving {x} KB / {x}ms — {fix}
  ...

FIXES BY AREA
  Images    ...  (with commands/HTML)
  CSS       ...
  JavaScript...
  Fonts     ...
  Delivery  ...

PROJECTED AFTER
  LCP ~{x}s   INP ~{x}ms   CLS ~{x}   (state assumptions)

VERIFICATION
  Re-run Lighthouse; confirm field data in PageSpeed Insights / CrUX after ~28 days.

Guardrails

Optimizations must preserve functionality — flag anything that could change behavior.
Field data (real users, CrUX) is the source of truth; lab data (Lighthouse) is a proxy. Say which one a number comes from.
Don't invent savings numbers — label estimates as estimates and show the reasoning.
All recommended tools are free: Lighthouse CLI, ImageMagick, cwebp/avifenc, PurgeCSS, and framework bundle analyzers.