Javascript Phonegap：图像库加载速度非常慢

我正在从sd卡读取图像，并将其显示在phonegap应用程序的多媒体资料中。 我有两个文件夹，我正在阅读其中的内容。一个是同步文件夹和非同步文件夹。 代码如下：

 listGalleryContents(synchedsdcardfolder, function() {
    listGalleryContents(unsynchedsdcardfolder, function() {
        showGalleryPage();
    });
 });




function listGalleryContents(directoryEntry, onComplete) {
var directoryReader = directoryEntry.createReader();
directoryReader.readEntries(function(entries) { // success get files and folders
    for(var i=0; i<entries.length; ++i) {
        if(entries[i].name.indexOf(".") > 0 && entries[i].isFile) {
            imagesArray.push(entries[i].fullPath);
        }
    }
    onComplete();
} , function(error){ 
    alert("Error: = " + error.code);
});
}

listGalleryContents（SynchedsCardFolder，函数（）{
listGalleryContents（未同步的SDCardFolder，函数（）{
showGalleryPage（）；
});
});
函数listGalleryContents（目录条目，onComplete）{
var directoryReader=directoryEntry.createReader（）；
readEntries（函数（条目）{//success获取文件和文件夹
对于（var i=0；i 0&&entries[i].isFile）{
imagesArray.push（条目[i].fullPath）；
}
}
onComplete（）；
}，函数（错误）{
警报（“错误：=”+错误代码）；
});
}

当我有太多的图像无法从sd卡读取时，问题就出现了。 当我点击gallery view时，加载图像会花费很多时间。

---

有没有办法让它更具响应性并提高性能

Javascript是单线程的，因此回调将在阻止UI的同一主线程中触发。尝试将代码更改为：

listGalleryContents(synchedsdcardfolder, loadUnSyncedFolder);

function loadUnSynchedFolder() {
   setTimeout(function() {
       listGalleryContents(unsynchedsdcardfolder, allFoldersLoaded);
   }, 0);
}

function allFoldersLoaded() {
   setTimeout(showGalleryPage, 0);
}

function listGalleryContents(directoryEntry, onComplete) {
var successCallback = onComplete;
var directoryReader = directoryEntry.createReader();
directoryReader.readEntries(
     function(entries) { readSuccess(entries, successCallback); } , 
     function(error){ 
        alert("Error: = " + error.code);
     });
}

function readSuccess(entries, onComplete) { // success get files and folders
    var i = 0, length = entries.length; 
    for(; i < length ; ++i) { // why are you using ++i and not i++ ??
        if(entries[i].name.indexOf(".") > 0 && entries[i].isFile) {
            imagesArray.push(entries[i].fullPath);
        }
    }
    onComplete();
   }
}

listGalleryContents（SynchedsCardFolder、loadUnSyncedFolder）；
函数LoadUnsynchronizedFolder（）{
setTimeout（函数（）{
listGalleryContents（未同步的SDCardFolder、allFoldersLoaded）；
}, 0);
}
函数allFoldersLoaded（）{
设置超时（showGalleryPage，0）；
}
函数listGalleryContents（目录条目，onComplete）{
var successCallback=onComplete；
var directoryReader=directoryEntry.createReader（）；
directoryReader.readEntries(
函数（entries）{readSuccess（entries，successCallback）；}，
函数（错误）{
警报（“错误：=”+错误代码）；
});
}
函数readSuccess（entries，onComplete）{//success获取文件和文件夹
变量i=0，长度=entries.length；
对于（；i0&&entries[i].isFile）{
imagesArray.push（条目[i].fullPath）；
}
}
onComplete（）；
}
}

---

我尚未测试此代码。如果您看到错误，您可能需要对其进行轻微修改。

非常感谢。性能似乎有了很大提高。我有一些疑问。问题1：我们能否在listGalleryContents（）中设置超时；类似于线程的东西，因此我使用一些值填充imagesArray并调用onComplete（）；然后其余的填充在后台发生？查询2：设置setTimeout（function（），0）有什么用处；在LoadUnsynchronizedFolder（）和allFoldersLoaded（）中，因为其中只调用了一个方法。是否该控件返回allFoldersLoaded（），但不会调用showGalleryPage（）；？ThanksI将首先回答您的“查询2”：setTimeout（function（）{}，0）允许浏览器在“可以”时执行排队操作，并且不会强制它在特定时间内执行。至于您的“查询1”：避免闭包是一种很好的做法，这就是为什么我将成功处理程序放入自己的函数中。成功处理程序将在最常见的情况下被调用，这就是为什么我将错误处理程序闭包（内联）保持原样。非常感谢。我实现了这个，并与我的客户分享了它。由于存在一些延迟，他不满意：（.我可以做些什么吗？没有等待时间。我将我的图库视图拆分为多个页面，在一个页面中显示一定数量的图像。当我单击“下一步”转到下一个图库页面时，它有时会在大约6秒钟内没有响应，因为它将等待填充imagesArray。你认为我可以这样做吗有什么办法让它更有效率吗？谢谢