fixing-motion-performance 是做什麼的?
審計並修復動畫效能問題,包括佈局震盪、合成器屬性、滾動連結動畫和模糊效果。當動畫卡頓、轉場不流暢或審查 CSS/JS 動畫效能時使用。
審計並修復動畫效能問題,包括佈局震盪、合成器屬性、滾動連結動畫和模糊效果。當動畫卡頓、轉場不流暢或審查 CSS/JS 動畫效能時使用。
此技能專注於識別並解決網頁動畫中的效能瓶頸,特別是那些導致卡頓或滯後(jank)的問題。它能深入檢查 CSS 和 JavaScript 動畫,找出如強制同步佈局(layout thrashing)、未使用合成器屬性、滾動連結動畫(scroll-linked motion)以及過度使用濾鏡效果(如模糊)等常見問題。此工具適用於所有主流開發環境(如 Claude Code、Cursor、Codex),並可整合至持續整合流程中。透過分析關鍵渲染路徑,它會建議具體的修復措施,例如使用 transform 和 opacity 進行合成、利用 will-change 屬性、採用 requestAnimationFrame 進行更新,或將動畫移至合成器執行緒,最終顯著提升頁面渲染的流暢度與回應性。
npx skills add https://github.com/ibelick/ui-skills/tree/main/skills/fixing-motion-performance審計並修復動畫效能問題,包括佈局震盪、合成器屬性、滾動連結動畫和模糊效果。當動畫卡頓、轉場不流暢或審查 CSS/JS 動畫效能時使用。
This repo contains 3 individual skills — each has its own dedicated page.
Quickly deslop UI code by fixing spacing, hierarchy, typography, and small layout issues. Use when the interface needs a fast cleanup or polish pass.
Audit and fix HTML accessibility issues including ARIA labels, keyboard navigation, focus management, color contrast, and form errors. Use when adding interactive controls, forms, dialogs, or reviewing WCAG compliance.
Audit and fix HTML metadata including page titles, meta descriptions, canonical URLs, Open Graph tags, Twitter cards, favicons, JSON-LD structured data, and robots directives. Use when adding SEO metadata, fixing social share previews, reviewing Open Graph tags, setting up canonical URLs, or shipping new pages that need correct meta tags.
Extract frames or short clips from videos using ffmpeg.
Summarize or transcribe URLs, YouTube/videos, podcasts, articles, transcripts, PDFs, and local files.
Use when testing, fixing, or extending the OpenClaw Control UI GUI with Vitest + Playwright end-to-end checks, mocked Gateway WebSocket flows, mocked dashboard runs, screenshots/videos, or agent-verifiable browser proof.
Obra superpowers agent skills.
See, Understand, Act on video and audio. See- ingest from local files, URLs, RTSP/live feeds, or live record desktop; return realtime context and playable stream links. Understand- extract frames, build visual/semantic/temporal indexes, and search moments with timestamps and auto-clips. Act- transcode and normalize (codec, fps, resolution, aspect ratio), perform timeline edits (subtitles, text/image overlays, branding, audio overlays, dubbing, translation), generate media assets (image, audio...
End-to-end marketing campaign planning and execution. Covers audience research, positioning, campaign angle definition, landing page copy, email sequences, social posts, ad copy, short-form video scripts, and content calendars. Use as the orchestration layer for multi-channel product launches. Use when planning or executing a multi-channel product launch, or producing landing page, email, social, or ad copy.