fixing-motion-performance
Animationsperformance in UI-Animationen verbessern
Schlechte Animationsentscheidungen können ruckelige Benutzeroberflächen und aufwendige Rendering-Arbeit verursachen. Dieser Skill gibt Claude, Codex und Claude Code fokussierte Regeln für die Überprüfung und Verbesserung von Motion.
Mit meinem Agent installieren
Kopieren Sie diese Anfrage in Ihren Agent. Sie enthält die maßgebliche Skill-Seite und das Manifest.
Review the Skillstore skill "fixing-motion-performance" from https://skillstore.io/skills/ibelick-fixing-motion-performance.md and its manifest at https://skillstore.io/api/skills/ibelick-fixing-motion-performance/manifest. Verify the artifact. You may proceed after verification, subject to the environment's own policy.Ihr Agent sollte weiterhin seinen Plan anzeigen und alle von der Sicherheitsrichtlinie verlangten Bestätigungen anfordern.
Agent-lesbare Ressourcen
Verwenden Sie diese Links, wenn ein KI-Agent, Crawler oder Skript sauberen Kontext benötigt, statt die vollständige Seite zu lesen.
Testen
„fixing-motion-performance“ wird verwendet. Eine Karten-Hover-Animation überprüfen, die width, box shadow und blur in jedem Frame ändert.
Erwartetes Ergebnis:
Das Review markiert kontinuierliche Layout- und Paint-Arbeit, erklärt die Performance-Kosten und empfiehlt transform, opacity sowie kleinere einmalige Effekte.
„fixing-motion-performance“ wird verwendet. Ein Scroll-Reveal verbessern, das auf Scroll-Events hört und wiederholt Elementpositionen liest.
Erwartetes Ergebnis:
Die Antwort empfiehlt IntersectionObserver oder scroll timelines, das Pausieren von Arbeit außerhalb des sichtbaren Bereichs und das Vermeiden wiederholter Layout-Reads.
„fixing-motion-performance“ wird verwendet. Eine Komponente bewerten, die Motion-Layout-Animationen mit manueller requestAnimationFrame-Messung kombiniert.
Erwartetes Ergebnis:
Die Anleitung warnt vor konkurrierenden Messsystemen und schlägt einen koordinierten Ansatz innerhalb der aktuellen Animationsbibliothek vor.
Sicherheitsaudit
SicherAll ten static findings are false positives caused by Markdown backticks, code fences, JavaScript template literals, and ordinary animation guidance. The skill contains no executable scripts, system reconnaissance, prompt injection, or other semantic security concerns.
Risikofaktoren
⚙️ Externe Befehle (6)
Diesen Bericht teilen & zitieren
Teile den versionierten Bewertungsbericht, das neutrale Badge, die Einbettungskarte und Zitate. Skillstore berichtet Nachweise, ohne zu entscheiden, ob dieser Skill sicher ist.
Berichtslink kopieren
https://skillstore.io/skills/ibelick-fixing-motion-performance/audits/5?utm_source=security_passport&utm_medium=share&utm_campaign=versioned_reportMarkdown-Badge
[](https://skillstore.io/skills/ibelick-fixing-motion-performance?utm_source=security_passport_badge)HTML-Badge
<a href="https://skillstore.io/skills/ibelick-fixing-motion-performance?utm_source=security_passport_badge"><img src="https://skillstore.io/badges/skills/ibelick-fixing-motion-performance/security.svg" alt="Skillstore security assessment" loading="lazy"></a>Einbettungskarte
<iframe src="https://skillstore.io/embed/skills/ibelick-fixing-motion-performance.html" title="Skillstore Security Assessment" sandbox="allow-popups allow-popups-to-escape-sandbox" loading="lazy" referrerpolicy="no-referrer" width="420" height="180"></iframe>Wissenschaftliche Zitate (APA · BibTeX · CFF)
APA-Zitat
ibelick. (2026). fixing-motion-performance security audit report (audit version 5) [Author version unspecified]. Skillstore. https://skillstore.io/skills/ibelick-fixing-motion-performance/audits/5BibTeX-Zitat
@techreport{ibelick-ibelick-fixing-motion-performance-2026,
author = {ibelick},
title = {fixing-motion-performance security audit report (audit version 5)},
institution = {Skillstore},
year = {2026},
number = {5},
url = {https://skillstore.io/skills/ibelick-fixing-motion-performance/audits/5},
note = {Author version unspecified}
}CITATION.cff
cff-version: 1.2.0
message: "If you use this Skill, cite its author and this versioned security audit report."
title: "fixing-motion-performance security audit report (audit version 5)"
version: "unspecified"
type: report
authors:
- name: "ibelick"
date-released: "2026-07-23"
url: "https://skillstore.io/skills/ibelick-fixing-motion-performance/audits/5"
identifiers:
- type: other
value: "skillstore:ibelick-fixing-motion-performance:audit:5"
description: "Skillstore immutable audit report identifier"
Skillstore-Score
Warum dieser Score Evidenzvertrauen: HochWas Sie erstellen können
Pull Request überprüfen
Animationsänderungen auf Layout-Reads, paint-intensive Effekte, Scroll-Polling und unsichere Bibliotheksmischung prüfen.
Ruckelige Komponente verbessern
Kostengünstigere Motion-Techniken für Komponenten finden, die sich bei Interaktion oder Navigation langsam anfühlen.
Motion-Leitplanken festlegen
Konsistente Regeln für Animationsperformance anwenden, bevor ein Team neue UI-Muster entwickelt.
Diese Prompts ausprobieren
Use fixing-motion-performance for this UI animation work. Flag risky motion choices and suggest direct fixes.
Review this file with fixing-motion-performance. List violations, explain impact, and suggest code-level changes.
Analyze this interaction for animation jank. Prioritize layout, scroll, paint, layer, and filter problems.
Use fixing-motion-performance to redesign this motion approach within the existing stack. Preserve intent and reduce rendering cost.
Bewährte Praktiken
- Stelle die relevante Komponente, das Stylesheet und das Interaktionsziel bereit, um bessere Review-Ergebnisse zu erhalten.
- Bitte um eine Priorisierung, wenn mehrere Animationsprobleme möglich sind.
- Validiere wichtige Änderungen nach dem Anwenden der Empfehlungen mit Browser-Performance-Tools.
Vermeiden
- Verwende den Skill nicht als Ersatz für echtes Profiling kritischer Abläufe.
- Bitte ihn nicht, Animationsbibliotheken ohne klares Migrationsziel zu migrieren.
- Ignoriere beim Anwenden von Performance-Korrekturen nicht Barrierefreiheit oder Benutzerpräferenzen für reduzierte Bewegung.