Landing Page Speed

Inventories every resource on a landing page, ranks the speed problems, applies safe fixes after a backup and your go-ahead, and writes a report with the rest.

Used by our auditing team

What It Does

It reads a landing page and its linked files, lists everything that loads, and ranks what slows the page down. It then fixes the safe items: image dimensions, lazy loading, script loading, font loading and resource hints. A report lists the rest, including server settings it cannot change from a page file.

Backups are made before any edit. Nothing is deleted without your confirmation, including CSS that looks unused.

Who Uses It

Our auditing team runs it on client landing pages before launch and when a page feels slow. It also suits developers who want a checklist-driven pass over a single page.

Setup

Copy the skill/ folder into your agent's skills folder as landing-page-speed, for example .claude/skills/landing-page-speed/. You can also fetch it through the Thinqmesh MCP server.

Nothing else is installed. Give the agent the path to the page file, and the image folder if it is separate. Run /landing-page-speed for the full pass, /landing-page-speed images for images only, or /landing-page-speed critical-css for above-the-fold CSS.

Example Result

Backups: index.html.backup, styles.css.backup

Applied
- width and height added to 9 images
- loading="lazy" added to 7 images below the fold
- hero image preloaded with high priority
- 3 scripts deferred, 1 analytics script set to async
- font-display: swap added to 2 font faces

Needs your decision
- 4 CSS rules look unused (lines 212 to 240). Remove them?

Manual
- Enable Brotli compression and long cache lifetimes for fingerprinted files.

How to Adapt

Change the budgets and targets in references/speed-optimization.md to match your team's standards. Edit the priority table in step 2 of SKILL.md if your clients weigh issues differently. Add your own hosting notes to step 8.