Pagespeed Debugger — Development skill for Claude Code

pagespeed-debugger

A [Claude Code](https://claude.com/claude-code) skill that diagnoses real PageSpeed Insights / Core Web Vitals problems (slow LCP, high TBT, poor CLS, a low Lighthouse performance score) on a **live URL** — using actual Lighthouse data, not guesses from reading source code.

**Read-only by default. Never modifies application code and never touches the target site beyond a normal page request.**

Works on any site, in any project, with any framework — nothing here is specific to one codebase.

Why this exists

A live LCP investigation (12+ second LCP on a set of production pages) started as manual `curl` + one-off scripting against the PageSpeed Insights API to get real numbers instead of guessing from the code. This skill turns that into three reusable scripts so the same investigation runs the same way every time, on any URL, in any project.

Quick install (one line)

From your project's repo root:

curl -sL https://raw.githubusercontent.com/tushar33/pagespeed-debugger/main/install.sh | bash

This clones the skill into `.claude/skills/pagespeed-debugger` (and drops the nested `.git`, so it doesn't create a submodule in your project).

Manual install

Drop this into any project as a Claude Code skill:

# from your project root
git clone https://github.com/tushar33/pagespeed-debugger.git .claude/skills/pagespeed-debugger

(Or `git submodule add` if you want to track upstream changes. Or just copy the folder if you don't need to pull updates.)

If your project already uses a different skill convention (e.g. a `skills/` folder + `.claude/commands/` symlinks), place `SKILL.md` wherever your convention expects it — everything in this repo resolves paths relative to `SKILL.md`'s own location (`scripts/`, `templates/`, and the optional `.psi-api-key` file all live next to it), so it works unchanged wherever you put it.

How to invoke

Use the pagespeed-debugger skill on https://example.com/slow-page

Use