Как оптимизировать запросы ajax в JQuery?
Я создаю мобильное приложение, используя jquery mobile, jquery и php back-end.
Моя проблема связана с некоторыми страницами, которые я отправляю и получаю несколько запросов ajax, которые заметно замедляют производительность и вызывают утечку памяти, что приводит к сбою приложения в низких сетевых соединениях.
Каковы возможные способы оптимизации запросов ajax?
note: - Я периодически отправляю несколько запросов ajax (например, один раз в секунду) Некоторые ajax отправляются на основе событий
Ответы
Ответ 1
Во-первых, правильно написанный код Ajax не утечка памяти. Итак, если у вас действительно есть утечка, это скорее всего вызвано неправильным написанием кода, а не с помощью Ajax.
Затем вы можете рассмотреть ряд оптимизаций.
-
Объедините несколько запросов на ваш сервер в один большой запрос. Это экономит обратные вызовы на сервере, экономит пропускную способность, экономит заряд батареи и повышает производительность.
-
Не проводите опрос каждую секунду. Будьте умнее о том, как часто вы проводите опрос своего сервера.
-
Увеличьте интервал опроса, чтобы изменить его на основе вероятной активности, переключитесь на "длительный опрос" или переключитесь на webSocket, чтобы вы могли нажимать сервер без опроса.
-
Проанализируйте, что вызывает чрезмерное потребление памяти и исправляет ошибки или редизайн, чтобы сократить это. Нет никакой причины, что многие вызовы Ajax должны "утечка" памяти. Он будет переваривать время автономной работы, но при правильной кодировке не требуется утечка памяти.
О, и не стесняйтесь подтягивать некоторые широкомасштабные социальные веб-приложения, которые уже существуют, откройте отладчик, переключитесь на вкладку сети и изучите вопрос о том, что они делают. Вы также можете учиться на высокопроизводительных приложениях, которые уже решили эту проблему.
Ответ 2
Длительный опрос лучше, чем опрос
Если вы опросите заданный интервал, вероятно, лучше установить тайм-аут на стороне сервера и подождать, пока сообщение не будет отправлено до заданного числа циклов. Это особенно важно для SPA.
Однако, если вы опросите, вы должны увеличить интервал времени с каждым пустым ответом, который вы получаете.
Групповые запросы по событиям, а не по сущности
Скажем, вы проводите опрос каждые 10 секунд, чтобы получать новые сообщения. Кроме того, вы проводите опрос каждые 10 секунд, чтобы получить больше уведомлений. Вместо выполнения двух запросов вы должны сделать только один запрос ajax и вернуть один большой ответ json, который затем используется для изменения элементов DOM на стороне клиента.
Использовать серверные события или сокеты, если возможно
Сокеты или события, отправленные сервером, приведут к гораздо меньшему количеству запросов и будут уведомлять вас только о том, что что-то действительно произошло на стороне сервера. Вот хорошее сравнение .
Ответ 3
Кроме того, если вы хотите создать чат-сервер или отправить быстрые сообщения на сервер, вы должны использовать веб-сокеты, такие как socket.io.
Ответ 4
Вот несколько вещей, которые вы можете сделать
Во-первых,
- Избавьтесь от всех утечек памяти. Поместите приложение в песочницу и дайте ему самое сложное время, чтобы записывать утечки памяти. Изучите их и исправьте свой код.
Затем
-
Уменьшить количество запросов. Тщательно исследуйте лучшие пороги в своем приложении и только инициируйте свои запросы на тезисы. Постарайтесь выполнять ваши запросы и помещать их в один запрос, когда это возможно.
-
Используйте GET-запросы, когда это возможно. Они сравнительно просты и будут действовать быстро. Этот шаг важен для приложения, которое вызывает много запросов в его работе.
-
Выберите формат данных. Это может быть обычный текст, JSON или
XML. Выясните тот, который оказывает самое низкое влияние на ваш
приложение и переключиться на это соответствующим образом. Настройте свой сервер
для использования сжатия данных, если это возможно.
-
Оптимизируйте сервер. Используйте правильные заголовки Expire
или Cache-Control
для контента, являющегося сервером. Используйте ETags
, если это возможно.
-
Попробуйте разместить свой контент на CDN. Это может помещать ресурсы в
географически более близкое расположение к пользователю и ускорить работу приложения.
Ответ 5
Есть в основном 3 шага для оптимизации (сведение к минимуму) вызовов jQuery AJAX:
- Либо передать выполненную функцию обратного вызова в качестве аргумента при вызове вашей функции
- вернуть объект jqXhr из функции и назначить выполненный обратный вызов
- В качестве альтернативы можно переключиться на использование jQuery.ajax() и передать весь объект
Пожалуйста, обратитесь к этой ссылке: Как оптимизировать (свести к минимуму) вызовы jQuery AJAX
Ответ 6
Для этого вы можете использовать функцию кеша вызова Ajax, которая поможет вам получить все данные в первый раз во время запроса и сохранить в кеше, а со следующего раза не будет выполнен запрос Ajax и обработка данных с использованием только кэшированных данных.
Кроме того, вы можете оптимизировать время запроса и время ответа Ajax, уменьшив количество данных, запрошенных и отправленных во время вызова Ajax. Это можно сделать только путем удаления нежелательных данных во время вызова Ajax.
Кроме того, вся оптимизация зависит от кода и логики базы данных. Чтобы повысить производительность и снизить производительность приложения, вам поможет оптимизированный код и логика базы данных.
Ответ 7
- Создать переменную с обратным вызовом ajax и использовать ее
- Каждую секунду вы создаете новый экземпляр запроса xhr, который будет находиться в
памяти до тех пор, пока не будет выполнен обратный вызов. Способ создания нового ajax
запрос по предыдущему завершению ajax, это означает, что у вас будет только один
xhr запрашивать экземпляр во время.
-
После отправки данных на сервер очистите данные объекта, например:
array.length = 0; object = null; image.src=""; file = null;
Ответ 8
Как сказал @jfriend00, запросы Ajax не генерируют проблем с утечками памяти...
вот что делает ваш код!
Лучший способ сделать то, что вам нужно, - открыть слой Socket с вашей службой уровня данных, поэтому вместо опроса вы можете получать уведомления о произошедшем изменении модели домена.
Оформить заказ на Socket.io...
Если вы не хотите внедрять Socket Layer, я думаю, что есть немного способов увеличить производительность...
Одна вещь, которая, кроме того, конечно, для операций улучшения кода (рефакторинг, ecc.), на мой взгляд, вы можете сделать, это реализовать "систему управления хвостом" ..
- Изучите, как работает Promises (es6, jQuery, Q, bluebird)
- Создайте QueueService, простой Javascript-класс, который знает, как сериализовать все задачи (Ajax) (promises);
- Взаимодействие с QueueService между контроллерами и службами доступа к данным
- Внедрение простой облегченной CacheSystem, которая предотвращает ненужные AjaxRequests!