css 変換アニメーションの一部として select 要素を含めると明らかにリフローが発生し、アニメーションの知覚される滑らかさとレンダリング時間に悪影響を及ぼします。現在、デスクトップ ブラウザでは、これはあまり重要ではなく、ほとんど目立ちませんが、モバイル デバイスでは不要なリフローは非常にコストがかかります。
この問題を示す基本的なフィドルは次のとおりです。http://jsfiddle.net/w6NUT/
Dev Tools タイムラインを開き、選択要素を設定するdisplay: none;
と「レイアウト」レコードが停止することに注意してください。
多くの子要素を持つノードのフリップ アニメーションを作成しているかなり複雑な Web アプリがあり、この「選択」要素が唯一の問題の子です。
これを回避する方法についてのアイデアはありますか? 私はこれをバグとして webkit 関係者に提出することになるかもしれませんが、短期的なクラッジ ハックの修正も探しています。