What is the advantage of displaying JSON in string format within the page response itself? Is it better to render the page and then load data through AJAX after rendering?
When considering usability, what is the most effective approach? While Angular is a popular choice, what method should be used to create a Single Page Application (SPA)?
It's essential to find a balance between two conflicting needs:
- Sending more data (either as a formatted view or to enhance the view) results in a faster application readiness and reduces reliance on additional AJAX calls.
- However, sending more data also increases the application loading time.
There isn't a one-size-fits-all rule. As a general guideline, loading data that will be needed anyway can be included from the start. The method and timing of loading depend on the nature of the data.
Data that may be required but isn't certain is best left unloaded initially and fetched via AJAX if necessary later on.
Another important factor is how data is served and who the target audience is. For browsers that support request pipelining, multiple scalable AJAX calls can be made. If this feature isn't supported, manual pipelining can help reduce latency and improve compression performance, although it may increase functional coupling.
Consider these options:
- Load a somewhat blank page and make AJAX calls with Angular to populate the content, causing an initial loading effect.
- Load all necessary HTML content via server-side code initially without any AJAX requests. Further AJAX requests can be made as needed.
- Include JSON data for the page in stringify format within script tags along with some HTML. Angular can use this JSON data for templating and rendering directly without additional AJAX calls during page load.
Content should be distributed based on the above strategies.
- Non-repetitive HTML that is immediately needed shouldn't be loaded via AJAX. It's better to include it from the beginning to avoid latency.
- Non-repetitive HTML that isn't immediately needed can be loaded asynchronously as HTML to speed up the initial page load.
- Highly repetitive HTML could be divided into templates and corresponding data sent as JSON for efficiency. This minimizes errors and reduces rendering mechanism duplication.
Consider the lifespan of information - bundle resources together for maximum caching benefits and responsiveness improvement. Organizing data differently or architecting the application differently could yield differing results, emphasizing the importance of having a clear model of the application's functionality beforehand.
TL;DR
In conclusion, understand the application's purpose first before dividing the data cake among different strategies.