Ajax замедляет страницу

Question

У меня есть веб-страница с ajax. Ajax ДОЛЖЕН загрузить некоторые данные с другого веб-сайта, что занимает некоторое время. В течение этого времени загрузки мой сайт плохо реагирует на ввод пользователя (переход на другую страницу и т. Д.). Прежде чем кто-то кричит - да, я знаю, это из-за ajax. :)

Мой вопрос - есть ли способ ограничить пропускную способность AJAX? Быстрый сайт - мой приоритет, загрузка данных в фоновом режиме - вторична.

Итак, если у меня есть javascript, который вызывает php (ajax), а затем php, использующий cUrl, получает некоторые данные и возвращает их обратно в javascript (фактический код слишком длинный, чтобы публиковать его здесь, никто не будет его точно читать: D) есть ли способ предотвратить блокировку моей страницы этим механизмом, пока это не будет сделано?

Answer 1

Вопрос в том, что замедляет вашу страницу? Это может быть несколько вещей из вашего описания.

Несколько вещей, о которых следует помнить при помощи ajax:

1: большинство браузеров одновременно выполняют только два xhr-запроса на домен

2: если необходимо проанализировать результат вызова xhr и выполнить синтаксический анализ очень сложно, как, например, eval'ing json в старых браузерах, это может привести к зависанию браузера во время анализа данных (js однопоточный по натуре, если не считать веб-работников в html5)

3: если результат ajax вынуждает браузер повторно визуализировать страницу из-за dom-инъекции, рендеринг может казаться медленным и немного зависать в старых браузерах.

4: если у вас есть ограничения пропускной способности, попробуйте запустить xhrs, когда браузер завершит работу с другими вещами, например, дождитесь domReady при загрузке страницы

Answer 2

Ищите асинхронную загрузку исходных файлов Javascript, я надеюсь, что вы уже используете асинхронные вызовы XHR.См. Документацию по отслеживанию Google Analytics для примера использования:

<script type="text/javascript">  (function() {
    var ga = document.createElement('script');     
    ga.type = 'text/javascript';
    ga.async = true;
    ga.src = ('https:'   == document.location.protocol ? 'https://ssl'   
            : 'http://www') + '.google-analytics.com/ga.js';
    var s = document.getElementsByTagName('script')[0];
    s.parentNode.insertBefore(ga, s);
    })();
   </script>

http://code.google.com/apis/analytics/docs/tracking/asyncUsageGuide.html