javascript - 使用Javascript进行更快的API调用

我正在制作一个名为“您的音乐人生”的应用，该应用中，用户插入了他/她的生日，并且该应用显示了自出生以来每个生日的热门广告牌。该应用程序目前运行缓慢，因为需要花费一些时间才能从Last.fm api中检索所有专辑封面图像。我想知道如何通过JS / jQuery加速API调用。看起来线程可以解决这个问题，但我不确定如何实现...

这是应用程序：http://www.dailyspiro.com

和关键代码：

function compileDisplay(birthDays) {
    // create an HTML list that for each birthday displays top song, artist, and album art
    htmlObj = {}
    for (i = 0; i < birthDays.length; i++) {
        var age = birthDays[i][0]; // age isn't equal to i if user was born before 1958
        var date = birthDays[i][1];
        try {
            var track = billboard[date]['song'];
        } catch (err) {
            console.log(date)
        }
        var artist = billboard[date]['artist'];
        getAlbumArt(age, track, artist, birthDays);
    }
}

function getAlbumArt(age, track, artist, birthDays) {
    $.getJSON("http://ws.audioscrobbler.com/2.0/?method=track.getInfo&api_key=6ad5bad28ffc4dedbcf1115b3ddf5273&artist=" + artist + "&track=" + track + "&format=json&callback=?", function (data) {
        try {
            var image = data.track.album.image[2]['#text'];
            if (image == 'http://cdn.last.fm/flatness/catalogue/noimage/2/default_album_medium.png') {
                throw 'generic image';
            }
        } catch (err) {
            var image = 'images/' + track + '.jpg';
        }
        compileHtml(age, track, artist, image, birthDays)
    })
}

最佳答案

一般注意事项：


你缺少很多;在某些行的末尾
birthDays对象的最后一个元素后面有一个，这是错误的
birthDays对象很大（如果可以的话，尝试找出另一种处理它的方法。
除了上面的建议（尤其是@Jason P关于将所有请求合并为一个的评论），我还建议以下内容：




由于birthDays非常大，我建议每5或10年创建多个对象
这将加快循环



缺点是您现在必须在多个对象上循环播放，因此也许可以像这样组织它们

{d60To65：{........}，d65To70：{.......} .....}

加上这会增加代码的复杂性



注意：根据规范，js对象是无序的（内部对象就是这种情况-生日）

因此，我建议您使用JS链表来确保订购

http://www.nczonline.net/blog/2009/04/13/computer-science-in-javascript-linked-list/

5-修复您的循环，也许像这样for (var i = 0, l = birthDay.length; i < l; i++)

6-将您的var直接放在函数启动后，而不是在每个循环上创建它们

 var age = 0; //number as it can't be otherwise and now you can easily make checks on it
    var date = ""; //a string for the same reasons as age
    var artist = ""; //same comment
    var track = ""; //same comment

对函数中的var的相同评论（可能在其中找到它们）

7-您可能想检查Moment.js是否使用js日期，因为它具有一些实用程序功能

希望这有所帮助

并且由于某种原因，该轮播无法在Firefox 22上运行（如果需要支持）

关于javascript - 使用Javascript进行更快的API调用，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/18215833/