0

写真名の配列を使用して空のリストを作成しようとしています。私はすでにこの作業を行っていますが、大量の写真では比較的遅くなる可能性があります. 500 枚を超える写真も珍しくありません。

誰かがこのコードをより速く動作させる方法を見つけられるかどうか、またはこのコードの実行が遅くなる原因を教えてください。

私が持っているコードは次のとおりです。this.photoListElement は、順序付けられていないリスト要素を参照する jQuery オブジェクトです。photoNames は、写真名文字列の配列です。変数は関数の先頭で宣言されますが、ここには示されていません。isThumbDownloaded は、オブジェクト内の変数をチェックします。getThumb と getThumbId は、いくつかの文字列を一緒に追加する関数です。

(...)
place = [];
for(i=0; i< photoNames.length; ++i) {
    photoName = photoNames[i];
    if(coverages.isThumbDownloaded(coverageId, photoName)){ // A function which checks if a photo is downloaded. If it is, the photo should not be hidden, and the right background should be applied.
        bg = 'background-image:url(\''+coverages.getThumb(coverageId, photoName) + '?' + new Date().getTime()+'\');';
        cls = '';
    } else {
        bg = '';
        cls = 'hidden';
    }
    place[i] = '<div id="'+ this.getThumbId(photoName) +'" photoName="'+photoName+'" style="'+bg+'" class="phoPhoto '+cls+'" onclick="$.mobile.changePage($(\'#carousel\'), {transition: \'slidefade\'})"></div>';
}
this.photoListElement.html(place.join(''));
(...)

助けていただければ幸いです。

調査後

問題はループではなく、いくつかの小さな最適化を行うことができますが、dom の挿入です。

4

2 に答える 2

1

ループでは、各反復で photoNames の数を数えています。

for(i=0; i< photoNames.length; ++i)

代わりに長さを変数に保持すると、ループが高速になります。

for (var i = 0, ilen = photoNames.length; i < ilen; i += 1)

また、文字列連結は配列結合よりも高速な場合があります。このjsperfを確認してください。

そう：

place = "";

...

place += '<div>.......';

..

this.photoListElement.html(place);
于 2013-07-02T12:16:47.847 に答える