ブラウザの速度（レンダリング）を遅くするCSSルール

私はあなたのCSSコードでできる最大の間違いを探しています。ブラウザの速度（レンダリング）を遅くするCSSルール例えばブラウザの速度（レンダリング）を遅くするCSSルール

：あなたは、このクラスで10個のドラッグ可能な要素（内部の多くのタグ）をお持ちの場合

.myDraggables { 
    box-shadow: 0px 1px 2px #000 inset; 
    -moz-box-shadow: 0px 1px 2px #000 inset; 
    -webkit-box-shadow: 0px 1px 2px #000 inset; 

    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#cdcdcd, endColorstr=#fff); 
    background: -webkit-gradient(linear, left top, left bottom, from(#cdcdcd), to(#fff)); 
    background: -moz-linear-gradient(top, #cdcdcd, #fff); 

    border-radius:5px 7px 1px 3px; 
    -moz-border-radius:5px 7px 1px 3px; 
    -webkit-border-radius:5px 7px 1px 3px; 
}

、ドラッグは、（ジャーク）非常に遅くなります。だから、あなたは使用すべきでないCSSルールのリストを知っていますか？

出典

2011-11-05 user970727

多くの場合、スタイルの組み合わせです。この場合、グラデーション、丸みを帯びたコーナー、ドラッグの組み合わせ、それらの多くがあります。 – GolezTrol

ブラウザによっても異なります。 IE8はFFに比べていくつかの強みを持ち、その逆もあり、Chromeは本当にすべてをうまく処理しているようです。 –

@GolezTrol ...と影... –

簡単に作ることができます：大きな領域の背景リピートとして小さな画像（5x5と言うことがあります）を使用することは、レンダリングに関しては遅いです。したがって、繰り返しパターン（例：50x50）では大きな画像を使用することをお勧めします。ファイルのサイズはわずかに増加しますが、パフォーマンスは向上します。

出典

2011-11-05 12:50:47

避け、長いパスが

body div div ul li span a {}

避けCSSの表現は

background-color: expression((new Date()).getHours()%2 ? "#B8D4FF" : "#F08A00");

すなわち、IEとMicrosoftが実装何すなわちDXなどの要素に溢れ設定を割り当てる

出典

2011-11-05 13:44:01 toomanyairmiles

は、モバイルでのスクロールが遅くなりますブラウザ

出典

2015-06-01 16:07:37

いくつかの参考文献を挙げることができますか？ –

ブラウザの速度（レンダリング）を遅くするCSSルール

答えて

関連する問題