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

回答

相關問題