%26logoUrl%3Dhttps%253A%252F%252Finblog.ai%252Finblog_logo.png%26blogTitle%3Dhyeonjeong-jang-0302&w=3840&q=75){kind=logo}
SSR (Server Side Rendering)은 웹 애플리케이션의 초기 로딩 속도와 검색 엔진 최적화를 개선하기 위한 기술이다. 기존의 클라이언트 사이드 렌더링과 달리, SSR은 서버에서 페이지를 완전히 렌더링한 후에 클라이언트에 전달한다.
SSR의 작동 방식
사용자가 웹 페이지에 접속하면 서버는 해당 페이지의 HTML을 동적으로 생성한다. 서버는 데이터를 가져와서 페이지를 완전히 구성한 후, 클라이언트에게 그 결과를 전달한다. 이렇게 되면 사용자는 페이지를 빠르게 볼 수 있고, 검색 엔진은 페이지의 내용을 쉽게 인덱싱할 수 있다.
SSR의 장점 중 하나는 초기 로딩 속도의 개선이다. 페이지가 서버에서 완전히 렌더링되기 때문에 사용자는 빠르게 페이지를 볼 수 있다. 또한, 검색 엔진 최적화를 위해서도 SSR을 사용하는 것이 좋다. 검색 엔진은 페이지의 내용을 크롤링하여 인덱싱하는데, 클라이언트 사이드 렌더링을 사용하면 초기에 비어있는 페이지가 보여지기 때문에 인덱싱이 어렵다.
하지만 SSR은 일반적으로 클라이언트 사이드 렌더링보다 서버 리소스를 더 많이 사용하고, 복잡한 애플리케이션에서 구현하기 어렵다는 단점도 있다. 또한, 초기 로딩 속도의 개선은 사용자 경험을 향상시키지만, 이후의 상호작용은 클라이언트 사이드에서 처리해야 하므로 추가적인 네트워크 요청이 필요할 수 있다.
SSR은 React, Vue.js, Next.js 등 다양한 프레임워크와 라이브러리에서 지원하고 있다. SSR을 구현하기 위해서는 서버 사이드 코드와 클라이언트 사이드 코드를 분리하여 작성해야 하며, 서버 사이드에서는 요청에 대한 라우팅 및 데이터 처리, 페이지 렌더링 등을 담당한다.
요약하자면, SSR은 초기 로딩 속도와 검색 엔진 최적화를 개선하기 위한 기술로, 서버에서 페이지를 완전히 렌더링한 후 클라이언트에게 전달하는 방식이다. 이를 통해 사용자는 빠르게 페이지를 볼 수 있고, 검색 엔진은 페이지의 내용을 쉽게 인덱싱할 수 있다. 그러나 구현이 복잡하고 서버 리소스를 많이 사용한다는 단점도 있다.
Share article
%26logoUrl%3Dhttps%253A%252F%252Finblog.ai%252Finblog_logo.png%26blogTitle%3Dhyeonjeong-jang-0302&w=750&q=75){kind=logo}
%26logoUrl%3Dhttps%253A%252F%252Finblog.ai%252Finblog_logo.png%26blogTitle%3Dhyeonjeong-jang-0302&w=256&q=75){kind=logo}