From the course: React: Server-Side Rendering

SSR: What, how, and why - React.js Tutorial

From the course: React: Server-Side Rendering

Start my 1-month free trial

SSR: What, how, and why

“

- [Instructor] Maybe you have heard of some of these different terms, isomorphic, universal, and SSR. But more often than not, they're referred to in the same context. Simply put, these are all different terms meaning the exact same thing, which is, that your application is rendered on the server instead of the client. So to better understand what happens when running your application on the server, let me first explain what happens in your regular React client-side application. Your backend provides APIs or data to your front-end-side client, then React with the data on hand renders the HTML of your application in the browser. Whereas in server-side rendering, the server renders the HTML and then sends it to the client, eliminating the need of the client to do these tasks. Depending on the size of your application, that could be beneficial. And there are some advantages to running your application in the server. For starters, if you are running a pretty large application or expect it to grow quite large, rendering on the server will have a performance improvement in terms of the response time of your application. Consider this fact, the browser in which your application renders is impacted by the machine it runs on. Therefore, if people are looking at your application on older hardware, such as an old phone, laptop or desktop, they will see a difference in performance to those running newer hardware. However, by rendering the application in the server, you control the performance of the render. Additionally, if you're concerned if your site or applications gets found in the top results of Google, Bing, and other search engine searches, that might be the second benefit of rendering an application on the server. JavaScript doesn't play well with search engines. And unfortunately, when Google for instance sends its robots to index your page, all it sees is JavaScript and not HTML. Over the past few years the situation has improved a bit, but you are better positioned to be indexed properly if what the robot sees is HTML. Keep all these items in mind when you consider SSR and whether you should make the move. So now that we've explored the basics of SSR, let's get going on working with this great approach.

Contents