Оптимизация.Диалог загрузки не появляется сразу, когда пользователь отправляет форму

Question

Я работаю над веб-приложением, которое позволяет пользователю просматривать и взаимодействовать с большими (метаболическими) сетями, отображаемыми в формате SVG. Это можно посмотреть здесь ссылка .

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

 $('#indexForm').submit(function() {
    dialog.dialog('open');
  ...

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

Моя проблема заключается в задержке, которая существует между моментом нажатия кнопки «Отправить» и моментом отображения диалога. Пользовательский интерфейс замораживается на заметное время сразу после нажатия пользователем.

Я подозреваю, что браузер перегружен количеством элементов на странице (карта SVG имеет много элементов ~ 3 МБ), поэтому он не может реагировать на такие события, как отправка формы немедленно. Будем рады любым объяснениям и предложениям по улучшению моего кода и решению этой проблемы.

Answer 1

Проблема в размере SVG, отображаемого на веб-странице.Задержка начала уменьшаться, когда я пытался оптимизировать данные SVG (я прочитал много элементов).

Answer 2

попробуйте добавить ваше диалоговое окно, чтобы открыть его по событию клика, а не внутри отправки, так:

$("#indexForm").click(function(){
       dialog.dialog('open');
});

чтобы увидеть, помогает ли это вообще производительности