Skills for Real Engineers. Straight from my .agents directory.
39 skills
webperf-interaction
Agent skill from
Intelligent interaction performance analysis with automated workflows for INP debugging, scroll jank investigation, and main thread blocking. Includes decision trees that automatically run script attribution when long frames detected, break down input latency phases, and correlate layout shifts with interactions. Features workflows for complete interaction audit, third-party script impact analysis, and animation performance debugging. Cross-skill integration with Core Web Vitals (INP/CLS correlation) and Loading (script execution analysis). Use when the user asks about slow interactions, janky scrolling, unresponsive pages, or INP optimization. Compatible with Chrome DevTools MCP.
How to install webperf-interaction
install webperf-interaction
# install the webperf-snippets pack with the skills CLI
npx skills add nucliweb/webperf-snippets# or add only this skill to Claude Code: copy the folder
skills/webperf-interaction/
# into
~/.claude/skills/webperf-interaction/ (all projects)
.claude/skills/webperf-interaction/ (one project)
1# WebPerf: Interaction & Animation23JavaScript snippets for measuring web performance in Chrome DevTools.45## Running a script671. Run the script with `mcp__chrome-devtools__evaluate_script`, passing the file instead of its code: `sourcePath` with the absolute path of `scripts/<Name>.js` in this skill, and `format: "script"`, since a script runs by itself and is not a function. Read the object it returns. The scripts have no console output, so the returned object is the result: `script`, `status` and the metric data (`value`, `rating`, `details`, `items`, `issues`), as described in `references/schema.md`.82. When `status` is `"tracking"`, the script keeps observing the page. After the interactions, call the function named in `getDataFn` with another `mcp__chrome-devtools__evaluate_script` call, as an arrow function in `function`, for example `() => getINP()`, and read the object it returns.93. When `status` is `"error"` or `"unsupported"`, read `error`: the page may not have loaded yet, or the browser lacks the API.10…
Excerpt shown under the repository's MIT license.
More skills in webperf-snippets
Keep exploring
Similar skill repositories
An agentic skills framework & software development methodology that works.
15 skills
A single CLAUDE.md file to improve Claude Code behavior, derived from Andrej Karpathy's observations on LLM coding pitfalls.
CC1 skill
Public repository for Agent Skills
20 skills
Makes your AI agent think like the laziest senior dev in the room. The best code is the code you never wrote.
CCCU6 skills
Persistent Context Across Sessions for Every Agent – Captures everything your agent does during sessions, compresses it with AI, and injects relevant context back into future sessions. Works with Claude Code, OpenClaw, Codex, Gemini, Hermes, Copilot, OpenCode + More
CCCXGHGM+135 skills