sumoselect 속도 문제

https://hemantnegi.github.io/jquery.sumoselect/

 

 

sumoselect는 UI와 기능이 딱 맘에 드는데 

특정 동작에서 도저히 쓸수 없을 정도로 느려지는게 문제..

 

특히 멀티콤보형태에서 "Select All"을 클릭시에는 option이 1000개 정도면 심하게 느려지고

그 이상이 되면 브라우저를 강제로 닫는 거말고는 답이 안나올정도로 느리다.

 

 

원인은 option수 만큼 loop 돌면서 click 이벤트를 호출해서, 시간이 오래걸리는 작업을 반복하는게 문제

 

loop안에서는 각option에 select만 걸어주고

나머지 작업은 loop밖으로 빼주니까 상당히 빨라졌다.

 

 

 

jquery.sumoselect.js 파일 수정

toggSelAll: function (c, direct) {
    
    console.time("calculatingTime");
    var O = this;
    O.E.find('option:not(:disabled,:hidden)')
        .each(function (ix, e) {
 
            var is_selected = e.selected,
                e = $(e).data('li');
            if (e.hasClass('hidden')) return;
 
/////////////////////////delete(여기가 문제)
//          if (!!c) {
//             if (!is_selected) e.trigger('click');
//          }
//          else {
//             if (is_selected) e.trigger('click');
//          }
/////////////////////////delete(여기가 문제)
 
 
/////////////////////////append1
            if ( (!!c && !is_selected) || (!c && is_selected) ){
                var li = e;
                if (li.hasClass('disabled')) return;
                var txt = "";
                if (O.is_multi) {
                    li.toggleClass('selected');
                    li.data('opt')[0].selected = li.hasClass('selected');
                    if (li.data('opt')[0].selected === false) {
                        O.lastUnselected = li.data('opt')[0].textContent;
                    }
                }
                else {
                    li.parent().find('li.selected').removeClass('selected');
                    li.toggleClass('selected');
                    li.data('opt')[0].selected = true;
                }
            }
/////////////////////////append1
        });
        
/////////////////////////append2
    if (O.is_multi) {
        O.selAllState();
    }
    if (!(O.is_multi 
            && settings.triggerChangeCombined 
            && (O.is_floating || settings.okCancelInMulti))) {
        O.setText();
        O.callChange();
    }
    if (!O.is_multi) O.hideOpts();
/////////////////////////append2
 
    
    if (!direct) {
        if (!O.mob && O.selAll){
                O.selAll.removeClass('partial').toggleClass('selected', !!c);
        }
        O.callChange();
        O.setText();
        O.setPstate();
    }
    
    console.timeEnd('calculatingTime');
},