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 回答
0

尝试使用

$('ul').append(ilen);

于 2013-07-02T12:19:22.460 回答