Agent skill

openwebf-app-performance-js

Measure and optimize WebF app performance from the JavaScript side (performance.mark/measure, bundle size, code splitting, debouncing, CSS transforms). Use when the user mentions performance.mark/measure, JS profiling, heavy JS work, bundle size, code splitting, debouncing, or animation performance.

Stars 163
Forks 31

Install this agent skill to your Project

npx add-skill https://github.com/majiayu000/claude-skill-registry/tree/main/skills/development/openwebf-app-performance-js-archview-ai-webf-plugin

SKILL.md

OpenWebF App: Performance (JavaScript Side)

Instructions

  1. Establish a measurement baseline (prefer production builds for accuracy).
  2. Add minimal instrumentation (performance.mark/measure) around suspected hot paths.
  3. Apply high-leverage best practices:
    • reduce sync work on critical path
    • debounce expensive operations
    • split bundles and monitor size
  4. Use MCP docs for recommended practices and code snippets.

If the user’s question is primarily about host-side FP/FCP/LCP wiring or dumpLoadingState, prefer openwebf-host-performance-metrics.

More:

Didn't find tool you were looking for?

Be as detailed as possible for better results