-
SSR vs CSRBackground 2022. 1. 6. 16:04
웹사이트 렌더링 방식 중 SSR(Server-side Rendering)과 CSR(Client-side Rendering)에 대해
정리하였습니다.
< How Does the Frontend Communicate with the Backend? >
Article : How Does the Frontend Communicate with the Backend?
How Does the Frontend Communicate with the Backend?
An overview of what goes on between the server and and the browser while using a modern web application.
vsupalov.com
The backend and frontend both work together to serve a single goal. It’s pretty helpful to keep it in mind at all times. They are made, so a user can access them. In detail this interaction can look like this:
- The user points their browser to one of your website’s urls
- This makes the browser send out one or more requests to your server
- The browser waits to receive responses from your server
- Every response is used to render a part of the site
- The user waits for the browser to render the page
- The user sees a useful and usable page
- The user interacts with the page
- Causing more requests to be sent out, to get more data and display new information, and so on
< What is Client-side Rendering? >
Advantages of client-side rendering
- They load faster after first load.
- No full page reload required.
- Powerful user experience with fast load.
Disadvantages of client-side rendering
- They have poor SEO.
- They load slower at first load.
< What is Client-side Rendering? >
Article : What’s Server Side Rendering and do I need it?
What’s Server Side Rendering and do I need it?
Introduction of modern JavaScript frameworks / libraries that focus on creating interactive websites or Single Page Applications the way…
medium.com
Article : What is Server Side Rendering
Advantages of Server-side rendering
- They have good SEO.
- They load fast at first
Disadvantages of Server-side rendering
- Poor user experience.
- Full page reload required.
+. Article : How to Enable Server-Side Rendering for a React App
How to Enable Server-Side Rendering for a React App | DigitalOcean
In this tutorial, you will initialize a React app using Create React App and then modify the project to enable server-side rendering.
www.digitalocean.com
'Background' 카테고리의 다른 글
Project Workflow (1) 2022.02.22 HTTP (0) 2022.02.10 Server-Side API Calls to External APIs (0) 2022.01.10 MVC : How to Structure your App (0) 2022.01.09 브라우저는 어떻게 동작하는가? (0) 2021.12.23 - The user points their browser to one of your website’s urls