2017-04-14 8 views
-1

私はこのコードを持っています。コードだけでページ上の3500の要素を追加することにパフォーマンスのHTML要素

var html = ''; 
 
for(var i = 0; i < 3500; i++) { 
 
\t html += ` 
 
    <span class="filter_receive_img_hover"> 
 

 
\t <span></span> 
 
\t <span></span> 
 
\t <span></span> 
 
\t <span></span> 
 
\t <span></span> 
 
\t <span></span> 
 
\t <span></span> 
 
\t <span></span> 
 
\t <span></span> 
 
\t <span></span> 
 
\t <span></span> 
 
\t <span></span> 
 
\t <span></span> 
 
\t <span></span> 
 
\t <span></span> 
 
\t <span></span> 
 
\t <span></span> 
 
\t <span></span> 
 

 
\t <span></span> 
 
\t <span></span> 
 
\t <span></span> 
 
\t <span></span> 
 
\t <span></span> 
 
\t <span></span> 
 
\t <span></span> 
 
\t <span></span> 
 
\t <span></span> 
 
\t <span></span> 
 
\t <span></span> 
 
\t <span></span> 
 
\t <span></span> 
 
\t <span></span> 
 
\t <span></span> 
 
\t <span></span> 
 
\t <span></span> 
 
\t <span></span> 
 

 
\t <span></span> 
 
\t <span></span> 
 
\t <span></span> 
 
\t <span></span> 
 
\t <span></span> 
 
\t <span></span> 
 
\t <span></span> 
 
\t <span></span> 
 
\t <span></span> 
 
\t <span></span> 
 
\t <span></span> 
 
\t <span></span> 
 
\t <span></span> 
 
\t <span></span> 
 
\t <span></span> 
 
\t <span></span> 
 
\t <span></span> 
 
\t <span></span> 
 
    
 
    </span> 
 
` 
 
} 
 

 
document.getElementsByClassName('item')[0].innerHTML = html;
.filter_receive_img_hover { 
 
    background: url('data:image/jpeg;base64,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'); 
 
     width: 120px; 
 
     height: 120px; 
 
     float: left; 
 
     margin: 10px; 
 
} 
 

 
.item { 
 
    width: 560px; 
 
} 
 
span { 
 
    display: block; 
 
}
<div class="item"> 
 
    
 
</div>

ページがスクロールされると、大量のメッセージが発生します。 多くのhtml要素を含むページのパフォーマンスを向上させるにはどうすればよいですか? pointer-events(このCSSハック)はページのパフォーマンスを改善していません。 また、スパンの数を減らすことはできません。

ご意見はありますか?

+0

ありがとうございます。スニペットについて知らなかった – Lestoroer

+0

最初に3500スパンを追加するのはなぜですか? – Vivick

+0

これはゲームのものです。それはさらに3500以上になります。最初に100カウント(遅れではない)をロードし、次第に(スクロールする)遅れが現れます。 – Lestoroer

答えて

1

すべて一緒に読み込まないでください。 負荷の一部の例:1 - 100,100 -200、.... スクロールすると次の部分が読み込まれます。 (類似のGoogle画像) 参照:jQuery load more data on scroll

+0

私はこれを好きです(実際のプロジェクトで)。しかし、遅れよりも終わりまでスクロールすると。 – Lestoroer