analyze-interaction-performance

Diagnose UI responsiveness issues using Event Timing and LoAF performance reports.

Updated May 13, 2026
One-click install
npx skills add https://github.com/lovebirdsx/universe-editor --skill analyze-interaction-performance-lovebirdsx
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: analyze-interaction-performance
Source: https://github.com/lovebirdsx/universe-editor/tree/main/.claude/skills/analyze-interaction-performance
Command: npx skills add https://github.com/lovebirdsx/universe-editor --skill analyze-interaction-performance-lovebirdsx

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? Interactive lag in the editor—slow typing, stuttering quick open, dropped frames when switching tabs, or sluggish scrolling in large files—is hard to diagnose without structured attribution. This Skill collects interaction performance reports (Event Timing + Long Animation Frame attribution) from real or seeded workspaces and classifies each slowdown as a genuine JavaScript bottleneck, rendering pipeline cost, or environmental noise before any code is changed. ## Core Features & Use Cases - Baseline and real-folder collection: Run seeded e2e tours for deterministic regression comparison, or point the collector at any real workspace folder via UNIVERSE_PERF_WORKSPACE to reproduce lag under real watcher, indexing, and search load. - Three-way diagnosis: Read slow-interaction reports with inputDelay/processing/presentation breakdowns plus LoAF script attribution to distinguish JS bottlenecks from rendering pipeline time and environment noise. - CDP Profiler verification: Confirm suspected JavaScript hotspots with Chrome DevTools Protocol sampling when LoAF attribution is insufficient. - Use Case: A user reports quick open feels laggy in a million-file workspace. Set UNIVERSE_PERF_WORKSPACE to that folder, run the collection spec with a lowered threshold, then read the report to find synchronous full-list scanning in the filter provider and verify the fix by rerunning the spec. ## Quick Start Ask the agent to collect an interaction performance report on a specific folder and diagnose whether the lag is a JavaScript bottleneck or rendering overhead.

Frequently Asked Questions about analyze-interaction-performance

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

FAQPage Schema
How do I diagnose slow typing or laggy quick open in an Electron app?

Run the interaction performance e2e spec against the target workspace to collect a report with Event Timing breakdowns and LoAF script attribution. The report separates input delay, processing time, and presentation delay so you can tell whether the lag is JavaScript or rendering.

How do I collect a performance report on a real workspace folder?

Set the UNIVERSE_PERF_WORKSPACE environment variable to the absolute folder path and run the interaction perf collect spec. Optionally set UNIVERSE_PERF_THRESHOLD_MS to a lower value like 50 to amplify attribution on the top slowest interactions.

What is the difference between Event Timing and LoAF attribution?

Event Timing breaks each interaction into input delay, processing, and presentation delay, where only processing is directly optimizable product code. LoAF attributes long animation frames to specific JavaScript functions via blocking duration and script entries, excluding renderer and compositor time.

Why do performance numbers differ between two runs of the same code?

Automated non-foreground windows systematically inflate presentation delay, sometimes by 2x, and running right after a build worsens it due to cold caches. Always rerun on an idle machine and compare the better of two runs before declaring a regression.

When should I use the CDP Profiler instead of the performance report?

Use the CDP Profiler when the report shows high processing time but LoAF attribution only shows no script attribution. Sampling at 100-microsecond intervals and aggregating self time reveals the actual call tree behind React synchronous rendering.

Does the real-folder collection modify my files?

Write operations only touch two probe files created at the workspace root and deleted afterward. Real files are opened read-only for quick open and search, so your workspace content stays untouched.