Server Side Rendering in NextJS - SSR

Опубликовано: 31 Март 2023
на канале: ReactJS tutorials
1,182
45

Learn more from: https://amzn.to/3FYGCOB

Now let’s talk about the key features of nextjs:
One of the many features is the built in Server side rendering.
What is server side rendering? Server-side rendering is the process of rendering a React application on the server side before sending it to the client's browser. In other words, when a user requests a page, the server generates the HTML for that page, including all of its components, and sends it to the client's browser, where it is displayed.

If we have application build only with react, and since react is client side rendering, the process of rendering a React application is on the client's browser using JavaScript. When a user requests a page, the server sends a minimal HTML file that includes a link to the JavaScript bundle for the application. The browser then downloads and executes the JavaScript, which generates the HTML and renders the components on the client-side. That is why if we inspect the source code of the page is pretty empty. Client side rendering is not a bad approach but it always depends what you want to achieve.
Server side rendering allows us to pre render pages on a server. SSR can improve the performance and SEO of a React application, as it allows the page to be loaded faster, and search engines can more easily crawl and index the content. It also provides a better user experience for users with slow internet connections or devices with limited processing power.

Setting server side rendering on a ReactJS app can be tricky but if we are creating nextjs app it automatically has server side rendering without any extra setups.
If we inspect the source code of nextjs app we can see that all the code is there prerendered from the server.
With nextjs after the initial load everything else works as standard react app running in the browser. This brings us to a conclusion that client side and server side rendering are blending in.

More key features in my next tutorial, thanks for watching.


Смотрите видео Server Side Rendering in NextJS - SSR онлайн без регистрации, длительностью часов минут секунд в хорошем качестве. Это видео добавил пользователь ReactJS tutorials 31 Март 2023, не забудьте поделиться им ссылкой с друзьями и знакомыми, на нашем сайте его посмотрели 1,182 раз и оно понравилось 45 людям.