jSon의 선택 상자 안에 매우 큰 옵션 목록 생성

javascript를 통해 jSon 객체에서 약 800 ~ 옵션을 생성 할 때 성능 문제가 발생합니다.jSon의 선택 상자 안에 매우 큰 옵션 목록 생성

새로운 목록이 생성되면 제안 사항, 변경 사항 또는 사용하여 고정 된 항목을 제거 하시겠습니까?

jQuery 사용.

function build_towns(selected,selected_country,selected_regions,selected_rajons) 
     { 
      tow_box.html(tow_box_empty); 
      var towns_priority = ''; 
      var towns_options = ''; 
       for(i=0;i < towns.length;i++) 
        { 
         if(selected_country > 0) {var find_similar = selected_country;var compare_to = towns[i].country_id;} 
         else if(selected_regions > 0) {var find_similar = selected_regions;var compare_to = towns[i].region_id;} 
         else if(selected_rajons > 0) {var find_similar = selected_rajons;var compare_to = towns[i].rajons_id;} 
         else {var find_similar = 1;var compare_to = 1;} // always will be equal, so it's the same as VIEW ALL 
         if(find_similar == compare_to) 
          { 
            if(towns[i].priority > 0) 
           { 
            if(towns[i].town_id == selected) {towns_priority += "<option value='" + towns[i].town_id + "' country='" + towns[i].country_id + "' region='" + towns[i].region_id + "' rajons='" + towns[i].rajons_id + "' selected>" + towns[i].town + "</option>";} 
            else {towns_priority += "<option value='" + towns[i].town_id + "' country='" + towns[i].country_id + "' region='" + towns[i].region_id + "' rajons='" + towns[i].rajons_id + "'>" + towns[i].town + "</option>";} 
           } 
           else 
           { 
            if(towns[i].town_id == selected) {towns_options += "<option value='" + towns[i].town_id + "' country='" + towns[i].country_id + "' region='" + towns[i].region_id + "' rajons='" + towns[i].rajons_id + "' selected>" + towns[i].town + "</option>";} 
            else {towns_options += "<option value='" + towns[i].town_id + "' country='" + towns[i].country_id + "' region='" + towns[i].region_id + "' rajons='" + towns[i].rajons_id + "'>" + towns[i].town + "</option>";} 
           } 
          } 
        } 
      if(towns_priority.length > 0) {return "<option value='0'>----------------</option>" + towns_priority + "<option value='0'>----------------</option>" + towns_options;} 
      else {return towns_options;}    
     }

감사합니다.

출처

2010-03-09 Somebody

~ 800 옵션을 생성하는 목적은 무엇입니까? 효율성은 아마 당신의 접근 방식을 바꾸는 것에 있습니다. – Jeremy

많은 마을, 지역 등. – Somebody

아니, 그렇게해야합니다. 나는 목록에서 마을을 옮길 수 없다. – Somebody

거기에있는 한 가지 문제는 문자열을 연결 유지한다는 것입니다. 이것은 일반적으로 모든 언어에서 잘못되었습니다. 자바 스크립트에서는 다음과 같이 더 빠릅니다.

var a = []; 
for(var i=0;i<1000;i++){ 
    a.push(i); 
    a.push(" hello"); 
} 
var s = a.join('');

즉, 코드를 프로파일 링하고 가장 느린 부분을 확인해야합니다. 800 DOM 요소는별로 들리지 않지만 브라우저가 멈추는 원인이 될 수 있습니다. 당신이 그것으로 살아야 할 수도 있습니다.

그건 그렇고, 유용성을 고려하면 800은 콤보에 비해 너무 많습니다. 나는 자동 완성으로 갈거야. 어쨌든 AJAX를 사용하고 있으므로 자동 완성 기능이 더 빠릅니다 ...

출처

2010-03-09 20:26:27 Kobi

고마워요! 둘 다 시도 할 것이다. – Somebody

가능한 경우 jQuery를 사용하지 마십시오. 원시 DOM이 빠릅니다.

jQuery를/정말 사용하고 싶다면 - 삽입하는 방법은 두 가지가 있습니다. 첫 번째는 각 객체 속성에 대해 새 객체를 만들어 DOM에 삽입하는 것입니다. 두 번째 방법은 1을 만들고 나서 이후의 각 옵션에 대해 clone()을 수행하는 것입니다. 어느 것이 더 빠르지는 모르지만 성능이 동일하지 않다는 것을 알고 있습니다.

출처

2010-03-09 20:25:39 Pickle

복제본을 보여 주시겠습니까? 감사! – Somebody

jSon의 선택 상자 안에 매우 큰 옵션 목록 생성

답변

관련 문제