私のウェブサイトにはいくつかのCSSアニメーションとトランジションがあり、それらはすべて、特定のブラウザー（ありがたいことに、ほとんどではありません）で、特定の古いハードウェアで非常にゆっくりとレンダリングされます。私はUAスニッフィングを避けようとしています。JavaScriptまたはJSライブラリを使用してブラウザーまたはハードウェア構成を検出し、その後、これらの機能を十分にサポートしていないことがわかっているブラウザーの非アニメーションバージョンをロードする方法はありますか？
あいまいさを解消するために、Modernizrのようなものを探しているわけではありません。
これは、低速のシステムを検出するには決して十分ではありませんが、そのようなシステムのユーザーへの影響を最小限に抑えることができます。
CSSトランジションを使用し、jQueryでトリガーし（必要に応じてクラスを切り替えることにより）、要素のアニメーションをレンダリングエンジンにオフロードして、ページの機能的な応答性が少なくとも損なわれないようにします。
正しいCSSプロパティを使用してください。たとえば、top:10px;left:10px;プロパティをアニメーション化するのではなく、より効率的なCSS変換を使用します。 transform: translateX(10px) translateY(10px)
transform: translate3d(0,0,0);ターゲット要素に追加または同様の回避策を追加して、ハードウェア（GPU）アクセラレーションをトリガーします。
アニメーションに完全に執着している場合、または何らかの理由でCSSなしでフォールバック機能（要素の非表示/表示/再配置）をトリガーする必要がある場合は、Modernizrの回避策を試すことができます。
if(!Modernizr.csstransitions) {
/*fallback logic*/
}