

If you're starting a new project and are serious about performance and SEO you should definately look into SSR. The server application will import your React applications root component and render it into a HTML document which is then returned to the client.ĭo I need to use server-side rendering in my React app? With server-side rendering, you need a server side application which handles the initial rendering of your React application. That's why you can host a client-side rendered React app by just serving the static files using a web server like nginx. Only once the JavaScript is downloaded and can be executed, will there be anything rendered on the screen.Īs we can see, the server doesn't really do anything here. html file and makes requests for any additional resources defined in it (CSS, JavaScript, favicon, images etc.). In client-side rendering, the browser makes a request for the index.html page, the server responds. Server-side rendering means rendering the initial HTML on the server instead of waiting for the JavaScript to be loaded in the browser and then rendering. This article will focus on how SSR works and we will also go through a simple example of using SSR. So if you're building a production app, I recommend using one of them because server-side rendering is quite hard to get right.īut if you want to understand how it works and what is happening under the hood in these frameworks, you definately should try it out. There are some awesome frameworks like n, next.js, astro or 11ty, which allow you to use one of (or both) techniques. If you want to develop SEO friendly and fast websites with React, you have two choices: server-side rendering (SSR) or static site generation (SSG).
