Table of contents
When a page is rendered by the browser, it first processes the HTML to display the content on the screen. Then, it executes the JavaScript (logic part) to make the page fully interactive, enhancing the performance of your web app.
This process of rendering the HTML first is called pre-rendering, a feature of Next.js that allows developer to render HTML on the server side. It reduces the web app's loading time and improves Search Engine Optimization (SEO) to some extent.
Types of Pre Rendering -
Static Generation
Server Side Rendering
Static Generation
In this process, HTML is generated at build time, and the same bundle is reused for each request instead of regenerating the HTML repeatedly. This method is recommended by Next.js because it is much more optimized.
Server Side Rendering
This approach is slightly different. Here, HTML is generated on each request, which involves more tasks. As a result, Next.js does not recommend it for most use cases.