When it comes the performance tradeoffs in application development , rendering methodologies plays an important role.
Generally we classify this as server side rendering and client side rendering but there is more to it. for a detailed study anyone can refer this link https://developers.google.com/web/updates/2019/02/rendering-on-the-web
But in this article i am trying to share a quick introduction to three types of the rendering .
- Static rendering
- Server rendering
- Client side rendering
Before getting into the subject let us check the performance time gaps which we can take for guaging the efficiency of a web application.
TTFB (Time To First Byte) - time between clicking link and first bit of content coming in.
FP (First Paint) - The first time any pixel becomes visible to the user.
FCP (First Content Paint) - The time when requested content becomes visible.
TTI (Time To Interactive) - The time at which a page becomes interactive.
Static rendering happens at build time offers a fast First Paint, First Content Paint and Time To Interactive assuming the client side js is limited.
Unlike server side rendering consistantly fast Time To First Byte since the HTML for a page doesnt have to be generated on the fly.
one of the drawback of the static rendering is that it individual HTML files must be generated for every possible Url.