Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    text
    copied!<p>There are several reasons for their design that are commonly applied:</p> <ol> <li>As the previous answers mentioned, caching can be utilized in the browser and JSON payload is lighter</li> <li>They are providing a clean separation between the service, the UI logic and data following the MVC pattern <ul> <li>JSON as a Model</li> <li>JavaScript UI Widget as View that renders the data</li> <li>Service layer as the Controller that provides the business logic/service that feeds into the UI Layer</li> </ul></li> <li><p>API driven architecture and separation mentioned in point #2 above allow the company to provide multiple channels delivery without too much rework. Consider if we want to build Twitter App for Android:</p> <ul> <li>JSON as Model stays the same, nothing needs to be rework here as the data is the same</li> <li>We now will change the View from HTML to Android Native UI, in this case we will need to code the UI layer code</li> <li>Service Layer as Controller remains the same and we dont' have to do anything here</li> </ul> <p>As you can see, this model provides a way for Google/Twitter to deliver into multi-channels without having to rewrite their logic. The same applies to Mobile WebView vs. normal Desktop WebView. All we need to change is the UI Layer and not the Data or Controller layer.</p></li> </ol> <p>This is why they are taking time to think about the design and architecture it as such. A tight coupling between the data and presentation would require them to rework a lot of code in order to be delivered in multiple channels. It's not about JSON vs. HTML or just the web but more of an architecture decision that would allow them to deliver their content to multi-channels (iOS, Android, third party App, Mobile WebView, Desktop View, Desktop App, etc). What you see in their HTML source is the manifestation of their strategy in WebView channel. </p>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload