Почему $ .getJSON () блокирует браузер?

Question

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

Чтобы улучшить время загрузки страницы, я перечисляю устройства, но не запрашиваю их состояние, пока страница не будет отображена. Это связано с тем, что на некоторые запросы, такие как через SNMP или другие API, может потребоваться до 5-10 секунд. Таким образом, для списка, скажем, десяти устройств, может потребоваться более минуты, чтобы пользователь посмотрел на пустую страницу. Поэтому вместо этого я делаю следующее:

На странице списка устройств у меня есть следующий скрипт:

$(document).ready(function () {

  var devices = $('div[name="runStatus"]');
  devices.each(function () {

    // Get device ID (I embed this using the HTML5 data-* attributes/annotations)
    var deviceId = $(this).attr("data-deviceid");
    var url = "/devmanager/status/" + deviceId;

    $.getJSON(url, function (response) {
      // Not actually important to the question...set text status, colours etc
      $('div[data-deviceid="' + deviceId + '"]').text(response);
      //...
    });
  });
});

Я обнаружил, что если я разрешу запускать этот скрипт, все ссылки на странице перестанут отвечать на запросы.

Я предполагаю, что это потому, что у меня довольно много почти параллельных асинхронных запросов, блокирующих, пока они не получат ответ от сервера, и каким-то образом "поток пользовательского интерфейса" блокируется этим?

Однако я думал, что этого не должно было случиться с AJAX.

Я считаю, что такое «блокирование» происходит в IE8, Chrome 8.0 и Firefox 3.6. На самом деле Chrome показывает курсор в виде стрелки + вращающийся унитаз (я использую Windows 7), как будто страница отображается не полностью.

Как я могу это исправить?

Answer 1

Оказывается, это не проблема на стороне клиента:

Не вызовет ли блокировка браузера несколько вызовов одного и того же действия ASP.NET MVC?

Может ли несколько вызовов одного и того же действия ASP.NET MVC вызвать блокировку браузера?- Ответ

Это было вызвано «особой» функцией ASP.NET, в которой сериализовано несколько запросов, выполненных в одном сеансе.

Answer 2

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

Вы пытались использовать Fiddler и смотреть на временную шкалу, чтобы увидеть, что блокирует?

Этот ТАК вопрос, вероятно, поможет:

Сколько одновременных запросов AJAX (XmlHttpRequest) разрешено в популярных браузерах?

Answer 3

У меня никогда не было проблем с $ .getJSON ().Насколько я знаю, он асинхронный.Вероятно, происходит ошибка JavaScript, поскольку вы пытаетесь это сделать:

$('div[data-deviceid="' + deviceId + '"]').text(response);

Я предполагаю, что здесь есть ошибка, потому что response является объектом или массивом javascriptне строкаЧто вам нужно сделать, это текст (response.desiredProperty) или текст (ответ [индекс]) в соответствии с типом объекта1013 * Поскольку ошибки JavaScript иногда приводят к тому, что наши браузеры ведут себя неожиданно, это МОЖЕТ (только может) решить вашу проблему.

Answer 4

Похоже, что getJSON использует asynchronous: false в качестве опции для xhr. Это как бы застает меня врасплох, что jquery будет использовать это как значение по умолчанию, поскольку по причинам, которые вы описываете, это всегда плохая идея

В данный момент у меня нет времени больше на это разбираться, но я выберу первый путь.