– we create awesome web applications

This is the 2nd post of the series, Part 1, Part 3, Part 4.

So the main question is - what does the backend code do in order to render its output? Static assets aside, the response will most probably include data that was fetched from some sort of database. If the output is a full HTML page, it should also include proper HTML markup around the data. This is called server-side rendering because the content of the whole HTML page is rendered by the server.

The bigger the HTML page the more expensive rendering will be.

In earlier web applications, each request type was handled by a separate script file. The script was interpreted line by line to render a web page. Several approaches were introduced to make the code more maintainable and MVC was one of the most successful ones. It’s worth mentioning that Rails, a Ruby-based MVC implementation that was initially released the same year that Zuckerberg launched Facebook, contributed significantly to the wide adoption of the MVC design pattern in web development. Model-View-Controller frameworks for many languages were released in the late 2000s.

MVC separates the concerns of the backend code. Requests are handled by a controller, it uses models to fetch data. The data is passed to views which are responsible for rendering pages. It’s a much better solution than a single script file that does all of the above. But tons of CPU and memory are still used to prepare HTML pages that became bigger and bigger.

And then along came Asynchronous JavaScript + XML, aka AJAX, almost nine years after the FastCGI specification was published and in the same year that the 3rd episode of Star Wars was released. The AJAX approach suggests fetching extra data from the server to update the current screen without reloading the entire page.

Web servers can render many types of content in response to an XMLHttpRequest - including HTML segments that can replace an existing part of the web page, Javascript code that can do anything (including UI effects and replacing parts of the HTML page) once it is evaluated by the browser, and pure data that is serialized in XML/JSON format.

Javascript code running in a browser uses XML/JSON data to update the content of a page. Beforehand, Javascript was used mostly for UI effects. This marked the beginning of a significant shift in the concept of web development. It was the beginning of client-side rendering. This shift actually affects backends as well, that no longer have to render expensive HTML pages. Instead, their main function is serving APIs. It almost makes the V-portion of the MVC framework redundant, because JSON format doesn’t include anything but the data itself. Now server CPUs and memory can be used for better purposes.