ReactJS ~React Server Components~

・React Server Components are a new type of React component that runs soly on the server and sends only the result(the UI structure) to the browser.

In traditional React, JavaScript was executed on the browser side to render the UI. However, using RSC enables the processing to be split between the server and the browser.

1. Key features of RSC
   ・Reduced browser load: As rendering is completed on the server side, the amount of JavaScript sent to the browser is significantly reduced.

・Faster data retrieval: Direct access to databases and file systems on the server minimises unnecessary communication(API request round-trips).

・Enhancedsecurity: Confidential information such as private keys and API tokens is not exposed to the browser and can be securely processed within the server environment.

1. The division of roles between server and client
   ・With the introduction of RSC, React will utilise the following two types of components.

Component Type: Server Component
Where Executed: Sever
Primary Purpose: data retrieval, database access, utilisation of large libraries

Component Type: Client Component
Where Executed: Browser
Primary Purpose: Interactive operations(clicks, form input), use of useState and similar

1. Differences from SSR Although often confused, their roles differ.

・SSR: A technique where the server generates the entire page’s initial display HTML

・RSC: A technique for creating components that function solely on the server side. Combining it with SSR enables faster and more efficient site construction.