Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

jQuery / AJAX - response format

I was wondering what's the best "format" for the data that gets sent back to the javascript to be in? When should I use a JSON string or just plain HTML? Are there any other options besides these two?

like image 529
Alex Avatar asked Oct 29 '10 18:10

Alex


People also ask

What is the format of AJAX?

AJAX stands for Asynchronous JavaScript And XML. In a nutshell, it is the use of the XMLHttpRequest object to communicate with servers. It can send and receive information in various formats, including JSON, XML, HTML, and text files.

What is dataType JSON in AJAX call?

What is dataType JSON in AJAX? The dataType option specifies the type of response data, in this case it is JSON. The timeout parameter specifies request timeout in milliseconds. We have also specified callback functions for error and success. The ajax() method returns an object of jQuery XMLHttpRequest.

What is contentType in AJAX?

contentType is the type of data you're sending, so application/json; charset=utf-8 is a common one, as is application/x-www-form-urlencoded; charset=UTF-8 , which is the default. dataType is what you're expecting back from the server: json , html , text , etc.


1 Answers

It depends on what the data being sent back is and how you plan to use it.

Pros and Cons:

  • Using json data and HTML generation JavaScript puts more load on the browser and less load on a server, plus no need to code presentation logic into the page which serves the data. And JSON data is usually much smaller.

  • Using HTML data and injecting straight into the page puts more work on the server, causes the AJAX-serving page to contain presentation logic. However, if the presentation logic is already contained in your server side code (directly or via templating language) and placing said presentation logic into JavaScript side would necessitate you to develop it from scratch, it may be a benefit instead of the downside.

In other words, use JSON data iff:

  • Your page will use that JSON data for purposes other than one-time generation of HTML. DUH.

  • Your page already contains JavaScript logic to build the HTML based on the data, or if creating such logic is very easy development cost. Especially if the opposite is true (e.g. putting the HTML generation logic server-side needs to be done and presents significant development cost).

  • Off-loading resource cost of converting the data into HTML from the server onto the browser is an important consideration.

  • JSON data is significantly smaller than the produced HTML, thus resulting in a MAJOR reduction of transmitted data. This speeds up both the server execution, AND the network transmission. We actually had like 20x speedup of a complex tree-displaying app by transmitting tree data as json instead of already-generated HTML code.

  • The URL producing the response can be re-used as a service for purposes OTHER than this one page, if the other possible/actual consumers would not be able to 100% re-use the HTML generated for this specific page.

like image 190
DVK Avatar answered Sep 22 '22 00:09

DVK