В чем разница между XMLHttpRequest, jQuery.ajax, jQuery.post, jQuery.get

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

• XMLHttpRequest - это необработанный объект браузера, который jQuery превращает в более удобную и упрощенную форму и совместимую с кросс-браузером функциональность.

• jQuery.ajax - это общий запросчик Ajax в jQuery, который может выполнять запросы любого типа и содержимого.

• jQuery.getи, jQuery.postс другой стороны, может выдавать только запросы GET и POST. Если вы не знаете, что это такое, вам следует проверить протокол HTTP и немного узнать. Эти две функции используют внутренне, jQuery.ajaxно они используют определенные настройки, которые вам не нужно устанавливать самостоятельно, что упрощает запрос GET или POST по сравнению с использованием jQuery.ajax. В любом случае GET и POST являются наиболее часто используемыми методами HTTP (по сравнению с DELETE, PUT, HEAD или даже другими редко используемыми экзотическими методами).

Все функции jQuery используют XMLHttpRequestобъект в фоновом режиме, но предоставляют дополнительные функции, которые вам не нужно выполнять самостоятельно.

использование

Поэтому, если вы используете jQuery, я настоятельно рекомендую вам использовать только функциональность jQuery . Забудьте XMLHttpRequestсовсем обо всем . Используйте подходящие варианты функции запроса jQuery и во всех остальных случаях используйте $.ajax(). Так что не забывайте , что есть и другие связанные с общим JQuery Ajax функции к $.get(), $.post()и $.ajax(). Что ж, вы можете просто использовать $.ajax()для всего своего запроса, но вам придется написать немного больше кода, потому что для его вызова требуется немного больше параметров.

аналогия

Это как если бы вы могли купить себе автомобильный двигатель, который вам нужно было бы создать вокруг него целую машину с рулевым управлением, тормозами и т. Д. Производители автомобилей производят готовые автомобили с дружественным интерфейсом (педали, рулевое колесо и т. Д.) так что вам не нужно делать все самостоятельно.

Каждый из них использует XMLHttpRequest. Это то, что браузер использует для выполнения запроса. jQuery - это просто библиотека JavaScript, а метод $ .ajax используется для создания XMLHttpRequest.

$ .post и $ .get - это просто сокращенные версии $.ajax. Они делают почти то же самое, но ускоряют написание запроса AJAX - $.postотправляют запрос HTTP POST и $.getотправляют запрос HTTP GET.

jQuery.getявляется оболочкой для jQuery.ajax, которая является оболочкой для XMLHttpRequest.

XMLHttpRequest и Fetch API (в настоящее время экспериментальные) - единственные в DOM, поэтому должны быть самыми быстрыми.

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

https://jsperf.com/xhr-vs-jquery-ajax-vs-get-vs-fetch

Из моих сегодняшних тестов видно, что только jQuery не является чистым или даже быстрым решением, результаты для меня на мобильных или настольных компьютерах показывают, что jQuery, по крайней мере, на 80% медленнее, чем XHR2, если вы используете слишком много ajax, на мобильных устройствах загрузка простого сайта займет много времени.

Само использование тоже есть в ссылке.

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

jQuery.ajax и XMLHttpRequest - это загрузка страницы, аналогичная post и get, за исключением того, что страница не изменяется. Любая информация, возвращаемая сервером, может быть использована javascript локально для любого использования, включая изменение макета страницы. Обычно они используются для асинхронной работы, пока пользователь может перемещаться по странице. Хорошим примером этого могут быть возможности автозаполнения путем динамической загрузки значений из базы данных для заполнения текстового поля. Основное различие между jQuery.ajax и XMLHttpRequest заключается в том, что jQuery.ajax использует XMLHttpRequest для достижения того же эффекта, но с более простым интерфейсом. Если вы используете jQuery, я бы посоветовал вам придерживаться jQuery.ajax.

Старый пост. но все же хочу ответить, одно отличие, с которым я столкнулся при работе с веб-воркерами (javascript)

веб-работники не могут иметь доступа на уровне пользовательского интерфейса. Это означает, что вы не можете получить доступ к каким-либо элементам DOM в коде JavaScript, который вы собираетесь запускать с помощью веб-воркеров. К таким объектам, как окно, документ и родительский объект, нельзя получить доступ в коде веб-воркера.

Как мы знаем, библиотека jQuery привязана к HTML DOM, и ее разрешение нарушит правило «запрета доступа к DOM». Это может быть немного болезненно, потому что такие методы, как jQuery.ajax, jQuery.post, jQuery.get, не могут использоваться в веб- воркерах . К счастью, вы можете использовать объект XMLHttpRequest для выполнения запросов Ajax.

Что касается методов JQuery идти, .postи .getпросто сделать .ajaxвнутренне, их цель состоит в том, чтобы абстрагироваться от некоторых ненужных опций .ajaxи предоставить некоторые значения по умолчанию соответствующих этого типа запроса соответственно.

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

Сам .ajaxпо себе метод выполняет XMLHttpRequest, он будет сильно оптимизирован для остальной части jQuery, но, вероятно, будет не так эффективен, как если бы вы сами настраивали все взаимодействие ... но в этом разница между написанием большого количества кода или письмо jQuery.ajax.