Which is better in AJAX request, Response with ready HTML or response with just data and write HTML using JavaScript, and this JavaScript will use a predefined HTML template to put the ing data inside and show on the page.
Creating the HTML on the server and send to the page, will decrease the client side JS code, but will increase the response size.
Sending the data to the client side will decrease the response size but will increase the JS code.
Which is better and most used?
Which is better in AJAX request, Response with ready HTML or response with just data and write HTML using JavaScript, and this JavaScript will use a predefined HTML template to put the ing data inside and show on the page.
Creating the HTML on the server and send to the page, will decrease the client side JS code, but will increase the response size.
Sending the data to the client side will decrease the response size but will increase the JS code.
Which is better and most used?
Share Improve this question edited Mar 19, 2017 at 7:06 Cœur 38.8k26 gold badges205 silver badges277 bronze badges asked Jun 28, 2009 at 22:17 Amr ElgarhyAmr Elgarhy 69k70 gold badges192 silver badges310 bronze badges 1- Similar to stackoverflow./questions/415699 – William Brendel Commented Jun 29, 2009 at 3:55
5 Answers
Reset to default 5I think the right solution is highly context dependent. There may be a right answer for a given situation, but there is no one size fits all answer. Generally, if I'm using a partial view that gets replaced via AJAX, I'll return html. If I'm performing an action on a small part of something, I'll use JSON. I'm probably more likely to use JSON as there are more situations where it fits, but I try to pick the best solution for the problem at hand. I'm using ASP.NET MVC, though. Other frameworks undoubtedly have different characteristic solutions.
I've seen both used. In addition to the tradeoffs listed in the OP, I'd add:
- It is better to send the information as data, not html since you'll then have more options in how you will use it.
- What is your fort level with JS?
- You can use multiple UI's (on different pages) and can re-use the data on the page. Eg display the data in a short form and in a long form, but use the same data source. -- letting the client switch between the two on a page without requiring a server trip.
- A pure JS implementation of the liquid template system is available for client-side templating: http://www.mattmccray./archive/2008/12/11/Liquidjs_A_Non-Evaling_Templat
Larry
I'll be extremely pragmatic here:
It depends on the amount and the plexity of the new markup.
If you need to return a elaborate piece of HTML, it's always better to write it in the server side and returning it as data, it's also easier to maintain.
Building plex HTML in the client side usually is cryptic, even with the use of modern js libraries.
On the other hand, if your extra markup is small, then you can create it with js. I've never done anything with ASP.NET AJAX, but having a asp page, a rails view, or a JSP with only a small fragment like <p class='info'>Row Updated</p>
its confusing.
Let the code speak to you, If you're fighting against javascript code to create markup in the client side, maybe it should go in the server side.
Lastly: don't worry too much about the size of HMTL vs JSON, and if you do, benchmark the requests to see if the difference isn't negligible.
I believe the more mon method is to pass the mass of markup (HTML/CSS) via synchronous navigation to site, and keep the AJAX request/response as lean as possible [citation needed].
Admittedly, it is pretty rare to see raw HTML returning as an AJAX response. Usually it will be a JSON response, as that is the easiest to eval()
with JS.
Since already most of the markup and styling classes are needed anyway, and might be used by "static" content as well, that leaves you the opportunity to keep the AJAX small, neat and to the point.
Usually when updating small parts of screen you can send the JSON back to the client and the client can easily update itself. If you are trying to build a plicated Grid then better to use an UpdatePanel.