webperf-interaction

Analyze interaction latency with INP and main-thread blocking via PerformanceObserver.

Updated May 12, 2026

Search Tags:#monitoring #interaction #web-performance #performance-analysis #inp #main-thread #layout-shift

Ready to run

npx skills add https://github.com/YeomanYe/skills --skill webperf-interaction

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: webperf-interaction
Source: https://github.com/YeomanYe/skills/tree/main/webperf-interaction
Command: npx skills add https://github.com/YeomanYe/skills --skill webperf-interaction

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) and references (resource) components.

What problem does it solve?

Intelligent interaction performance analysis to quickly diagnose INP issues, scroll jank, and main-thread blocking, enabling targeted optimizations.

Core Features & Use Cases

Automated INP audit workflows that attribute slow interactions to inputs, processing, or rendering delays.
Scroll-jank investigation with layout-shift correlation and long-animation-frame attribution.
Cross-skill integration with Core Web Vitals and Loading workflows for end-to-end performance debugging.
Decision trees that trigger follow-up scripts (e.g., attribution, breaking up tasks, code-splitting) when slow frames are detected.
Exportable, structured results for automated tooling and reporting.

Quick Start

Run a complete INP audit on the current page and review the interaction breakdown and recommendations.

Frequently Asked Questions about webperf-interaction

High-intent search queries and answers about installing and using this skill.

FAQPage Schema

How do I diagnose high INP and identify what causes interaction latency?▼

To fix scroll jank caused by layout shifts, investigate long-animation-frame attribution and correlate layout-shift metrics with main-thread blocking to identify and resolve rendering delays during scrolling.

How does PerformanceObserver help with real-time web performance analysis?▼

PerformanceObserver enables real-time web performance analysis by observing interaction entries and long tasks on the main thread, immediately triggering decision trees to attribute slow frames and recommend code-splitting or task-breaking fixes.

Can I integrate INP audits with Core Web Vitals monitoring workflows?▼

Yes, you can integrate INP audits with Core Web Vitals monitoring workflows through cross-skill integration, enabling end-to-end performance debugging across loading and interaction metrics to comprehensively assess page responsiveness.

What is the best way to export structured performance analysis results for reporting?▼

The best way to export structured performance analysis results is to use the audit workflow's exportable structured outputs, allowing automated tooling and reporting systems to directly consume interaction latency breakdowns and optimization recommendations.