2016-12-15 65 views
11

Załaduję 1000 rekordów do listy rozwijanej wyboru ładowania początkowego. Zajmuje to około 2 sekund w Chrome, ale zajmuje 30 sekund w IE 9. Również, anulować lub x out mod bootstrap w IE trwa 10 + s też. Wywołanie API jest w porządku, ale renderowanie jest tak powolne; Czy ktoś może mi wskazać jakiś kierunek?Ładowanie wybranych ładowań trwa zbyt długo w IE

Dlatego ładuję listę klientów i ustawiając wybraną. Oto kod.

var customerPicker = $('#customer-picker'); 
    API.getCustomers().then(function (result) { 
     loadDropdown(customerPicker, result.customers); 

     // set the selected to current customer; it takes 10s in IE 
     customerPicker.val(currentCustomerId).selectpicker('refresh'); 

     // it takes about 10s in IE too. selector is the bs modal div 
     $(selector).css('z-index', '1060').modal('show'); 
    }).catch(function (errorMessage) { 
     ToastManager.showError(errorMessage || 'An error occurred while loading customer list. Please try again.'); 
    }); 

    function loadDropdown($div, arr) { 
     var options = ''; 
     $.each(arr, function (i, item) { 
      options = options + '<option value="' + item.Value + '">' + item.Text + '</option>'; 
     }); 
     $div.html(options); 
    } 

enter image description here

+0

Czy wypróbowałeś '$ div.append ('

+0

@RobinMackenzie tak, próbowałem bez szczęścia. – Quentin

+1

Jaką wersję jQuery używasz? Jest całkiem możliwe, że możesz rozwiązać ten problem, próbując różnych wydań jQuery, ponieważ obie wymienione funkcje dotyczą bezpośrednio js. –

Odpowiedz

2

Czy próbowałeś ustawić wewnętrznąHTML w pętli;

$div[0].innerHTML += '<option value="' + item.Value + '">' + item.Text + '</option>'; 

Zamiast tego na końcu;

$div.html(options); 
1

Być może chcesz rozważyć bibliotekę serializacji, aby poradzić sobie z ilością rekordów, które naprawdę ładują się jednocześnie. Clusterize.js jest bardzo dobrze wykonany i pozwala przeglądarce tylko wyświetlać aktualnie oglądane przez klienta. Pokazuje w dowolnym miejscu ponad 100 000 rekordów, którymi można zarządzać w ten sposób.

https://clusterize.js.org/

0

Jquery może wystąpić spadek wydajności w starszych przeglądarkach. Here's a solution podobny do tego, czego doświadczasz. $.each() jest już dość powolny w porównaniu z natywnym JS.