Tell me more ×
Stack Overflow is a question and answer site for professional and enthusiast programmers. It's 100% free, no registration required.
up vote 9 down vote favorite
3

how will i find which method is best for a situation. Can anybody provide some examples to know the difference in terms of functionality and performance.

share|improve this question

4 Answers

up vote 17 down vote accepted

  • XMLHttpRequest in the raw browser object that jQuery wraps into a more usable and simplified form and cross browser consistent functionality.

  • jQuery.ajax is a general Ajax requester in jQuery that can do any type and content requests.

  • jQuery.get and jQuery.post on the other hand can only issue GET and POST requests. If you don't know what these are, you should check HTTP protocol and learn a little. Internally these two functions use jQuery.ajax but they use particular settings that you don't have to set yourself thus simplifying GET or POST request compared to using jQuery.ajax. GET and POST being the most used HTTP methods anyway (compared to DELETE, PUT, HEAD or even other seldom used exotics).

All jQuery functions use XMLHttpRequest object in the background, but provide additional functionality that you don't have to do yourself.

Usage

So if you're using jQuery I strongly recommend that you use jQuery functionality only. Forget about XMLHttpRequest altogether. Use suitable jQuery request function variations and in all other cases use $.ajax(). So don't forget there are other common jQuery Ajax related functions to $.get(), $.post() and $.ajax(). Well you can just use $.ajax() for all of your request, but you will have to write a little more code, because it needs a bit more options to call it.

Analogy

It's like you would be able to buy yourself a car engine that you'd have to create a whole car around it with steering, brakes etc... Car manufacturers produce completed cars, with a friendly interface (pedals, steering wheel etc.) so you don't have to do it all yourself.

share|improve this answer
is is there any advantage in using $.ajax() in terms of performance? – Rodrigues Jan 13 '11 at 4:33
@Rodrigues: not really. If you think of $.post and $.get the only thing slower is a small amount of code before $.ajax gets called. But if you'd write your own routines using XHR directly things could be a bit optimised but could be more buggy. I suggest you keep yourself on the jQuery side. It will make your life easier. And considering the fact that async call is taking much longer than the code issuing it you will probably notice no obvious difference between these calls. – Robert Koritnik Jan 13 '11 at 16:29
Thanks Robert Koritnik. so i will got with $.post and $.get. – Rodrigues Jan 14 '11 at 17:30
You can as well go with $.ajax to make your calls consistent everywhere if you want to. As long as you don't use XHR directly you're good to do it either way. – Robert Koritnik Jan 14 '11 at 17:42
@RobertKoritnik what about the caching issue in IE?Is it the same by using XMLHttpRequest and $.ajax()? – Bhargavi Jun 26 at 10:39
up vote 3 down vote

Each one of them uses XMLHttpRequest. This is what the browser uses to make the request. jQuery is just a JavaScript library and the $.ajax method is used to make a XMLHttpRequest.

$.post and $.get are just shorthand versions of $.ajax. They do pretty much the same thing but makes it quicker to write an AJAX request - $.post makes a HTTP POST request and $.get makes a HTTP GET request.

share|improve this answer
what about data transfer limit of each functions for upload and download – Rodrigues Jan 13 '11 at 4:38
A GET request will send all the data in the URL string - which can be limited by client/server (stackoverflow.com/questions/2659952/…). A POST requests sends all the data in the headers, so the URL size limit shouldn't be a problem (unless you have really long file and folder names to your script!). – Jonathon Bolster Jan 13 '11 at 10:20
ok. so in short u mean, to send more data use post and to receive more data use get, right? – Rodrigues Jan 14 '11 at 17:42
@Rodrigues - Yup, pretty much :) Generally if you're just looking to read something (e.g. a request to get a list of tweets from twitter) use GET. If you're looking to send something (e.g. posting a tweet) then use POST, – Jonathon Bolster Jan 14 '11 at 19:36
up vote 0 down vote

As far as the jQuery methods go, .post and .get simply do .ajax internally, their purpose is to abstract away some of the unnecessary options of .ajax and provide some defaults appropriate to that type of request respectively.

I doubt there's much difference in performance between any of the 3.

The .ajax method in itself does an XMLHttpRequest, it'll be heavily optimised as per the rest of jQuery, but it probably won't be as efficient as if you tailored the whole interaction yourself.. but that's the difference between writing lots of code or writing jQuery.ajax.

share|improve this answer
is there is any advantage in customizing jQuery.ajax – Rodrigues Jan 13 '11 at 4:49
I assume by that you mean using it over the shorthand methods, in my experience I find that the shorthand ones are useful if most of the defaults are what you want, if you need to be very specific about how to get the data you need .ajax is usually the way to go. – Steve Jan 13 '11 at 13:24
Thanks Steve. will use post and get. if u give some examples of .ajax i can do some comparison,. – Rodrigues Jan 14 '11 at 17:33
up vote 0 down vote

jQuery.post and jQuery.get simulate typical page loads, which is to say, you click on a submit button and it takes you to a new page (or reloads the same page). post and get differ slightly in the manner in which the data is sent to the server (good article about it can be found here.

jQuery.ajax and XMLHttpRequest are page loads similar to post and get, except that the page doesn't change. Whatever information the server returns can be used by javascript locally to be used in any way, including modifying the page layout. They're normally used to do asynchronous work while the user can still navigate the page. Good example of this would be autocomplete capabilities by dynamically loading from a database values to complete a text field. The fundamental difference between jQuery.ajax and XMLHttpRequest is that jQuery.ajax uses XMLHttpRequest to achieve the same effect but with a simpler interface. If you use jQuery I'd encourage you to stick with jQuery.ajax.

share|improve this answer
what is the advantage of using jquery over creating an XMLHttpRequest object xmlhttp.open, send() and responseText. – Rodrigues Jan 13 '11 at 4:45
XMLHttpRequest object is instantiated differently according to your current browser for one thing. It would require that you lug around a little bit of javascript upkeep to provide a basic interface using XMLHttpRequest. If you already have jQuery, it does it all for you. It's really a matter of convenience, not functionality since you can technically do the same thing with either. Not to mention that since jQuery wraps XMLHttpRequest object, it means it provides it to you in case you wanted to do something particular with it. – Neil Jan 13 '11 at 9:27
ok.. Thank you Neil for your suggestion... is there any IDE like visual studio available for using and debugging jquery with php or aspx. – Rodrigues Jan 14 '11 at 17:56
It's difficult to find an IDE which lets you debug both javascript and php or aspx simply because one is serverside while the other is clientside. It means that unfortunately, you have to debug the javascript separately. However, I've found that firebug (getfirebug.com) is marvelous for debugging javascript in general. Place a breakpoint in the callback function and it shows you everything you're given by the server and step by step, everything your javascript does with it. Hope that helps. – Neil Jan 18 '11 at 16:42

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.