Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Getting content: AJAX vs. "Regular" HTTP call

I like that, these days, we have an option for how we get our web content from the server: we can make an old-style HTTP request (with its own URL in the browser) or we can make an AJAX call and replace parts of the DOM on the fly.

My question is this: how do you decide which method to use when there's an option to use either?

In the "old days" we'd have to redraw the entire page (including the parts that didn't change) if we wanted to show updated content. Now that AJAX has matured we don't need to do that any more; we could, conceivably, render a "page" once and just update the changing parts as needed. But what would be the consequences of doing so? Is there a good rule of thumb for doing a full-page reload vs a partial-page reload via AJAX?

like image 274
Craig Walker Avatar asked Dec 04 '09 18:12

Craig Walker


People also ask

What is the difference between AJAX request and HTTP request?

HTTP allows the client to post 'forms' to the server. The server CGI program could use the client's form to change the HTML page sent to the client. AJAX is a way of using HTTP1 where the never changing parts of a website (i.e. some html and the javascript files2) are separated from the changing data.

Should I use AJAX or fetch?

Fetch is compatible with all recent browsers including Edge, but not with Internet Explorer. Therefore, if you are looking for maximum compatibility, you will continue to use Ajax to update a web page. If you also want to interact with the server, the WebSocket object is also more appropriate than fetch.

What is the difference between XMLHttpRequest and AJAX?

XHR is the XMLHttpRequest Object which interacts with the server. Ajax technique in the nutshell leverages the XHR request to send and receive data from the webserver. This object is provided by the browser's javascript environment. It transfers the data between the web browser and server.

Can we use HTTP GET or POST for AJAX calls?

jQuery - AJAX get() and post() Methods. The jQuery get() and post() methods are used to request data from the server with an HTTP GET or POST request.


2 Answers

If you want people to be able to bookmark individual pages, use HTTP requests.

If you are changing context, use HTTP requests.

If you are dividing functionality between different pages for better maintainability, use HTTP requests.

If you want to maximize your page views, use HTTP requests.

Lots of good reasons to still use HTTP requests - Stack overflow is a wonderful example of those divisions between AJAX and HTTP requests. Figure out why each function is HTTP or AJAX and I'm sure you will derive lots more reasons when to use each.

like image 194
MikeEL Avatar answered Nov 15 '22 15:11

MikeEL


My simple rule:

Do everything ajax, especially if this is an application not just pages of content. Unless people are likely to want to link to direct content, like in a blog. Then it is easier to do regular full pages.

Of course there are many blended combinations, it doesn't have to be one or the other completely.

like image 34
Geoff Avatar answered Nov 15 '22 14:11

Geoff