Understanding Rendering in Web Apps: SSR

snickdx

Nicholas Mendez

Posted on January 14, 2021

Understanding Rendering in Web Apps: SSR

Server-Side Rendering approaches typically generate markup on every request to the server. They return dynamic HTML content 'On the fly'.

Server-side scripts/languages

Server-side scripting languages provide syntax that is interpreted by the view engine of an application server to dynamically write HTML and send it in an HTTP response.
Examples:

The following is the example of a PHP script.

Template Engines

For application server runtimes such as; Nodejs, Python, Java, PHP etc. there are libraries called template engines that can provide templating syntax.

Examples:

The following is an example of a handlebars template:
Alt Text

Isomorphic/Universal JS

These approaches (also called meta-framework) allow you to render the first page of a client-side framework app on the server then deliver it to the client. This would allow the browser to show page content without needing to execute any javascript. The page is first only visible but then becomes interactable (or hydrated) when the client-side framework's javascript has finished loaded on the browser. Isomorphic frameworks run on nodejs on the server.

Examples of these are:

In the next post, we shall look at Client-Side Rendering.

💖 💪 🙅 🚩
snickdx
Nicholas Mendez

Posted on January 14, 2021

Join Our Newsletter. No Spam, Only the good stuff.

Sign up to receive the latest update from our blog.

Related