[TIL]23.06.14

hyein·2023년 6월 15일
0

TIL

목록 보기
9/34

리액트의 장점

SPA, CSR

SPA(Single Page Application)와 CSR(Client Side Rendering)는 리액트만의 장점은 아니지만 리액트 라이브러리의 주요한 장점이다. 이전의 SSR(Server Side Rendering)을 사용할 때에는 변화가 있을 때마다 새롭게 전체 페이지를 다시 로드해야 했다. ajax가 나온 이후에는 바뀐 부분만 특정해서 변화시킬 수 있지만 하나하나 동작을 지정하기는 쉽지 않았다. 또 서버에서 HTML, CSS, JS파일을 랜더링하는 방식은 안드로이드, IOS와 같은 다른 플랫폼과 서버를 공유할 수 없어서 비효율적이었다

CSR는 SSR과 달리 서버로부터 데이터를 받아서 클라이언트에서 랜더링하는 방식이다. 이러한 변화는 위의 두 문제를 해결해 주었다. 서버로부터 데이터를 받아서 바뀐 부분의 데이터가 있는 화면만 새롭게 랜더링함으로서 사용자 경험을 높여주면서 효율적으로 클라이언트 리소스를 사용하게 한다. 또 이렇게 서버가 HTML, CSS, JS파일을 랜더링하는 대신 데이터를 보내줄 경우, 안드로이드, IOS, 웹 모바일 등 다양한 플랫폼이 서버를 공유할 수 있게 되어 효율적으로 서버를 운영할 수 있게 된다.

*CSR은 검색엔진 SEO 최적화를 할 수 없는 문제가 있는데 리액트에서는 CSR과 SSR를 함께 사용할 수 있다. 이 장점은 다른 프론트엔드 프레임워크보다 더 사랑받았던 이유 중 하나이다.

컴포넌트 기반의 화면 구성

리액트는 화면의 한 부분을 컴포넌트 라는 단위로 나눌 수 있으며 독립적으로 관리할 수 있다. 대규모 웹 애플리케이션에서 컴포넌트는 역할과 기능에 따라 따로 관리하기 용이하며, 반복되는 부분을 대체할 수 있게 해주어서 코드 재사용성을 높여준다. 또 컴포넌트 기반의 화면을 구성한다면 블록 쌓기처럼 컴포넌트를 쌓아서 빠르고 효율적으로 화면을 구성할 수 있다.

profile
As I start to move towards the goal, the goal will start to move towards me.

0개의 댓글