如何優化5000個項目的Kendo UI Combobox的數據源？

Question

在我的測試中 - >http://jsfiddle.net/olragon/642c4/12/，KendoUI Combobox無法運行5000個項目，我如何在不調用severside數據源的情況下使其工作，或者這是KendoUI的限制？

HTML

<h3>T-shirt Fabric</h3> 
<input id="fabric" placeholder="Select fabric..." /> 

JS

/** 
* Returns a random integer between min and max 
* Using Math.round() will give you a non-uniform distribution! 
*/ 
function getRandomInt (min, max) { 
    return Math.floor(Math.random() * (max - min + 1)) + min; 
} 

$(document).ready(function() { 
    var superData = [] 
    , data = [ 
      { text: "Cotton", value: "1" }, 
      { text: "Polyester", value: "2" }, 
      { text: "Cotton/Polyester", value: "3" }, 
      { text: "Rib Knit", value: "4" } 
     ]; 

    for(var _i=0; _i<5000; _i++) { 
     var randomEntry = data[getRandomInt(0,data.length-1)]; 
     randomEntry.text += '-' + _i; 
     randomEntry.value += _i; 
     superData.push(randomEntry); 
    } 

    // create ComboBox from input HTML element 
    $("#fabric").kendoComboBox({ 
     dataTextField: "text", 
     dataValueField: "value", 
     dataSource: superData, 
     filter: "contains", 
     suggest: true, 
     index: 3 
    }); 
}); 

更新

• 小提琴鏈接已更新。
• Virtual scrolling and paging for Combobox was not yet supported by KendoUI

Answer 1

的問題是不是在劍道UI組合框，但在你的循環。你有沒有檢查它做了什麼（不是你想要它做什麼）？我會說有一個錯誤，因爲data[getRandomInt(0,data.length-1)]不會返回一個新的元素，而是一個引用，因此您將「_i」附加到相同的5個元素，多次構建一個很長的字符串。

試試這個：

for (var _i = 0; _i < 5000; _i++) { 
    var randomEntry = data[getRandomInt(0, data.length - 1)]; 
    var newEntry = { 
     text: randomEntry.text + '-' + _i, 
     value   : randomEntry.value += _i 
    }; 
    superData.push(newEntry); 
} 

檢查小提琴這裏的修改版本：http://jsfiddle.net/OnaBai/642c4/14/