Underscore.js性能问题 - 我可以使用_.defer

在我使用underscore.js和jquery构建的简单Web应用程序中。对于所有人（js对象）的列表，我筛选出他们访问过的所有地方（js对象）的列表。人员列表是一个带有td的html表格，具有位置图像图标，点击时显示他们访问的所有地点的列表。 只有在至少有一个地方参观过的人才能看到图标。这里的问题是人和地方的数量在2000,100。所以下面的代码执行2000*100组合。浏览器抱怨我的脚本无响应。代码在下面提供Underscore.js性能问题 - 我可以使用_.defer

_.each(peopleList, function (person, index, list) { 

    //filter the respective places for people 
    var visitedPlaces = _.filter(places, function (place) { 
     return place.PeopleId == person.Id; 
    }); 

    if (_.isEmpty(visitedPlaces)) { 
     $("a#" + place.PeopleId).remove(); 
    } 
});

死简单是不是它。对于每个人来说，检查访问过的地方是否有他跟踪过。我如何优化上面的代码来解锁和响应。在_.defer和_.delay试图把一些地方却没有改善

来源

2013-04-24 Deeptechtons

相关：http://stackoverflow.com/questions/13955976/how-can-i-defer-a-jquery-each-loop – m90 2013-04-24 05:45:43

@ M90感谢您的链接将更新答案如果它解决了我的问题 – Deeptechtons 2013-04-24 05:46:25

什么是'project.ProjectID'？ – Tomalak 2013-04-24 06:01:46

FWIW，这里是我会怎么解决这个问题的底线。

function removeNonTravelers(people, visits) { 
    var travelers = _.pluck(visits, 'PeopleId'), 
     nonTravelers = _.reject(people, function (person) { 
      return _.contains(travelers, person.Id); 
     }); 

    $(_.map(nonTravelers, document.getElementById)).remove(); 
}

http://jsfiddle.net/FWzeN/

来源

2013-04-24 11:29:29 Tomalak

精湛而棒极了，像魅力一样工作。谢谢你今天教我一些东西 – Deeptechtons 2013-04-24 16:29:23

var hashMap = {}; 

_.each(places, function(place) { 
    hashMap[place.PeopleId] = place; 
}); 

_.each(peopleList, function (person, index, list) { 

    //filter the respective project documents 
    var visitedPlaces = hashMap[person.id]; 

    if (visitedPlaces) { 
     $("a#" + place.PeopleId).remove(); 
    } 
});

来源

2013-04-24 06:32:06

我的建议是放弃下划线和使用纯JS这个：

function removeNonTravelers(people, visits) { 
    var i, peopleId, 
     numPeople = people.length, 
     numVisits = visits.length, 
     index = {}, nonTravelers = []; 

    // index 
    for (i = 0; i < numVisits; i++) { 
     peopleId = visits[i].PeopleId; 

     if (!index.hasOwnProperty(peopleId)) { 
      index[peopleId] = 1; 
     } else { 
      index[peopleId]++; 
     } 
    } 

    // find HTML elements to remove 
    for (i = 0; i < numPeople; i++) { 
     peopleId = people[i].Id; 

     if (!index.hasOwnProperty(peopleId)) { 
      nonTravelers.push(document.getElementById(peopleId)); 
     } 
    } 

    // remove them all at once 
    $(nonTravelers).remove(); 
}

这是相当快的。如果我没有犯任何错误，我的相当过时的笔记本电脑上的测试用例（2000人，100位）每秒超过700次操作（不包括DOM操作）。

亲自尝试一下：http://jsperf.com/where-not-exists-in-javascript

来源

2013-04-24 06:35:13 Tomalak

Underscore.js性能问题 - 我可以使用_.defer

回答

相关问题