JQuery UI Диалог медленный - PullRequest
Новая
       5

JQuery UI Диалог медленный

9 голосов
/ 13 июля 2010

Я недавно столкнулся с небольшой болью. Я использовал диалоговое окно JQuery для отображения некоторых экранов конфигурации в веб-приложении. Ничего особенного. Однако у меня есть несколько крайних случаев, когда эта форма конфигурации будет отображать выпадающий список ... 11000 вариантов. [УДЕРЖИВАЕТ ГНЕВЫЕ ТОМАТЫ]

Само собой разумеется, это медленно. Отображение диалога JQuery может занять до 9 секунд (и инициализация также медленная).

Первый вопрос: есть ли способ ускорить диалоговые окна? Из того, что кажется, он копирует весь контент при каждом открытии. Если бы был способ избежать этого, это немного помогло бы.

Второй вопрос: существуют ли другие диалоговые окна jQuery, которые работают лучше, когда их просят отображать большие объемы данных?

И, как всегда, приветствуются другие решения. Некоторое автозаполнение ajax не будет плохим, но, вероятно, будет медленным, если для этого не потребуется хотя бы пара начальных символов.

Ответы [ 8 ]

2 голосов
/ 03 марта 2012

Я столкнулся с этой проблемой и нашел решение здесь: http://forum.jquery.com/topic/select-in-dialog-causes-slowness-in-ie8

Просто нужно было установить параметры диалога draggable и resizable на false.

1 голос
/ 05 ноября 2012

Настройка перетаскивания и изменения размера на ложь сработала.

1 голос
/ 15 сентября 2010

Если вам нужно сделать выпадающий список в таком диалоге, то я предлагаю загрузить информацию в скрытый стиль div ajax после загрузки страницы, а затем отобразить этот скрытый div в любом лайтбоксе / диалоге, который вы используете, когда это необходимо. Таким образом, материал будет загружаться, пока пользователь выполняет другие действия, и, надеюсь, будет готов к тому времени, когда он будет готов.

1 голос
/ 10 сентября 2010

2 секунды звучат намного лучше, но вы, вероятно, обнаружите, что это очень сильно зависит от браузера пользователя и конфигурации системы - это может быть намного хуже в более медленной системе в IE ...

Я бы серьезно подумал об использовании чего-то другого вместо выпадающего списка мамонта (который, конечно, не может быть очень удобным для пользователя) - это звучит как хороший кандидат на окно поиска автозаполнения или, возможно, многоуровневое каскадное падение спады.

Вы также можете создать диалоговое окно при загрузке страницы и открывать его только при необходимости (установите в настройках autoOpen: false)

1 голос
/ 24 июля 2010

Удалось немного улучшить производительность.Я отклонился от пользовательского интерфейса JQuery и создал гораздо более легкую версию.Вместо того, чтобы копировать содержимое моей цели в мой диалог, я создаю свой диалог вокруг содержимого.

По производительности, диалог изменился с 10 секунд до 2.

1 голос
/ 14 июля 2010

Как насчет одного выбора со всеми возможными первыми буквами, получающего через AJAX только опции, начинающиеся с этой буквы, во второй выбор?

0 голосов
/ 17 марта 2015

Я только что столкнулся с этой проблемой, используя диалог с вкладками с сотнями флажков. Я нашел эту ссылку очень полезной. Раньше потребовалось 17 секунд, чтобы открыть диалоговое окно, но теперь оно сократилось до 1,3 секунд. ( Я использую перетаскиваемый диалог без изменения размера )

Хитрость заключается в том, чтобы отсоединить HTML-код перед открытием диалогового окна, а затем использовать функцию open для диалогового окна для повторного подключения содержимого. 

$('#triggerDialogFast').click(function () {
    var $dialogContainer = $('#dialogContentFast');
    var $detachedChildren = $dialogContainer.children().detach();
    $dialogContainer.dialog({
        width: 425,
        height: 400,
        draggable: false,
        resizable: false,
        open: function () {
            $detachedChildren.appendTo($dialogContainer);
        },
    });
});

Я не уверен, но, вероятно, это должно сработать, просто добавив html в функцию open , если это возможно в вашем сценарии.

0 голосов
/ 05 февраля 2011

в зависимости от того, какой html вы используете для отображения данных, т. Е. Может быть очень медленным по сравнению с Chrome или Firefox.

особенно при отображении больших таблиц.эти ссылки могут быть полезны - вы можете даже потратить немного больше времени.

http://jquery -howto.blogspot.com / 2009/02/5-easy-tips-on-how-to-improve-code.html

http://www.artzstudio.com/2009/04/jquery-performance-rules/

...