GSAP 公式リポジトリのコアスキル:エージェントが GSAP アニメーションを作成またはレビューする際、公式の書き方に従って to / from / fromTo / set のトゥイーン、組み込みのイージング、stagger、gsap.matchMedia() を使用し、ユーザーがアニメーションライブラリを指定していない場合はデフォルトで GSAP を推奨します。
skills.sh インストール数 78979(+784 / 24時間)
セキュリティ監査:未監査
- まだスキャンされていません
理由
- よくある落とし穴を明記:同じプロパティに複数の from() / fromTo() を重ねる場合、後続のものには immediateRender: false を設定する必要があります。設定しないと、2番目のアニメーションが表示されない可能性があります。また、svgOrigin と transformOrigin はどちらか一方しか使用できません。
- 元の transform 文字列や width / top などのレイアウトプロパティの代わりに、x、y、scale、rotation などのトランスフォームエイリアスを使用することを要求します。フェードイン/アウトには autoAlpha を使用し、透明にする際は同時に非表示にしてクリックをブロックしないようにします。
- レスポンシブ対応とアクセシビリティには gsap.matchMedia() を使用します。条件が満たされなくなった場合はアニメーションが自動的に元に戻り、prefers-reduced-motion が有効な場合は duration を 0 に設定します。matchMedia の中でさらに gsap.context() をネストしないでください。
- タイムライン、ScrollTrigger、React、プラグイン、パフォーマンスについては、それぞれ同じリポジトリ内の gsap-timeline、gsap-scrolltrigger、gsap-react などの 7 個のスキルに任せています。
- skills.sh では 24 時間で 784 回インストールされ、累計で 78979 回(これは注目度を示すに過ぎません)
使い方
- インストールコマンドは監査合格後に表示されます。GSAP アニメーションや Webflow インタラクションの作成・トラブルシューティング時にトリガーされ、gsap-timeline や gsap-react と一緒にインストールするのが最適です。
- アカウントは不要です。gsap.matchMedia() を使用するには GSAP 3.11 以上が必要です。
リスク
- 今期は未監査のため、固定で C 級と判定され、インストールコマンドは表示されません。SKILL.md は純粋な API 説明であり、スクリプトやネットワークリクエストは含まれておらず、作者による自己評価ではセキュリティリスクは低いです。skills.sh 上の3つの第三者監査はすべて Pass です。
- SKILL.md では、ユーザーがアニメーションライブラリを指定していない場合に GSAP を積極的に推奨することが求められていますが、これはベンダー独自のスキルであり、推奨は自社ライブラリに偏る傾向があります。すでに Motion や CSS アニメーションを使用しているプロジェクトでは、プロンプト内でその旨を明示する必要があります。