0

Please note; this is NOT a duplicate of one of the other similar questions here on SO, as I clearly explain in the fifth paragraph of this question. Furthermore, it is not opinion based. I'm merely asking for the pro's and cons of the two ways of doing things, and specifically why Stackoverflow does things the way it does them.

For my website I'm building a notification similar to how it is implemented here on Stackoverflow at the top; when you click the notifications icon, a dropdown is presented with the relevant notifications.

I currently wrote my system in a way that the api call returns a list of json objects containing the notifications, and I then construct the html in javascript in the browser. But when I look at the network calls made by SO, I see that the api call here simply returns the html which is then pasted into the dropdown.

I now wonder; why does SO do it like this? In my opinion it is way more efficient to just provide the data in json instead of all the html surrounding it.

I checked out another question on this topic here: which suggests a third option; some kind of templating system, but that is a bit too much for the simple html that I want to insert. So I don't really want to consider that option. One more question on this topic talks specifically about the performance difference, which I'm not too concerned about either (maintainability and simplicity is more important for me than those couple milliseconds difference).

So my question is; is it more advantageous (for whichever reason) to supply all the html or just the json on an api call, and why?

5
  • possible duplicate of Updating HTML via JSON/AJAX Commented Jan 29, 2015 at 13:14
  • That's a really good question! I certainly am on "team-json". And I strongly believe that templating is faster when on a mobile, when sending larger amounts of data. Commented Jan 29, 2015 at 13:14
  • I think this will be closed because it's opinion based. I'd prefer the HTML route if the data was fixed in time - reference data. If the drop down changes in time it makes sense to request it dynamically using AJAX-JSON. Commented Jan 29, 2015 at 13:16
  • it depends, if your data in json requires much processing on client side to generate the html and updating the document....send the HTML from server as server is more powerful than client when comes to performance. Commented Jan 29, 2015 at 13:20
  • With HTML you transfer content with layout, while with JSON, XML and so on you transfer data. With JSON you can also transfer methods. The main reason of an API is to be used by different clients independently, no matter of each system visual layout and behaviour. With HTML this will be hardly done, while with JSON you will be able to process the data and adapt the results to your flow easily. With WebServices you could also achieve even more - a great level of automation between API provider and consumers. Commented Jan 29, 2015 at 13:20

3 Answers 3

1

In an ideal world, and in order to have a clear separation of concerns, a web api should return a view agnostic response. That gives you a big flexibility in several fronts

  • You can use the same api to serve different client technologies
  • Even in case you don't use different client technologies you may want to change something related to presentation and, if you return view specific content, is possible you'll need to change your api logic to adapt the response.
Sign up to request clarification or add additional context in comments.

1 Comment

Second point is very important....your application UI will become closed for extension without changing the server side code.
1

I pefer JSON response because:

  • (+) It is reusable, you can display this notifications in dropdown on top bar and inside user profile -> one api service - many different controls/elements
  • (+) less data transfered via http
  • (-) More calculations client side, but these days, even mobile devices got multiple cores, so we are talking about few miliseconds

Comments

0

This is an opinion and so can not be an actual answer (question will be closed soon).

JSON, The reason is that any program of any significance will grow (they always do) and your conceptual knowledge of the state will atrophe (as it always does) That means you need to be clear in your program where the truth is.

This notion of truth works best when the truth lies in the data not the template or the presentation. I've learned through experience that any code should be driven by the data. And so sending JSON data to be manipulated seperates concerns lightens the complexity of the server code and allows more flexability on the client side to render any way you wish. And when you scratch your head in 6 months wondering why that bug is there you can follow the data and not guess where the logic could be.

Human Javascript by Henrik Joreteg explains this well.

Comments

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.