SSR로 동작하는 지 확인하는 방법

SSR로 동작하는 지 확인하는 방법

SEO에 도움이 되기 위해서는 CSR보다는 SSR을 활용하는 것이 좋습니다.
그런데 지금 페이지가 정상적으로 SSR로 동작하는 것을 어떻게 확인할 수 있을까요?

현재 프로젝트가 어떻게 동작하는 지 정확하게 이해하고 있으면 어디까지가 SSR이고 아닌 지 파악할 수 있습니다.
그러나 모르는 경우 내가 이 부분은 SSR, 이 부분은 CSR이라고 생각하고 구현을 했을 때,
내가 원하는 방향으로 동작하는 것을 확인할 필요가 있습니다.

아래 게시글은 크롬 기준으로 작성되어 있습니다.

SSR 동작 확인하는 방법

SSR 동작을 확인하는 방법은 매우 간단합니다.
JavaScript 동작을 없애면 됩니다.

아래 사이트는 제가 사이드 프로젝트로 진행하고 있는 사이트입니다.
• 다이싸 이동하기
검색에 도움되게 하기 위해 게임마다 설명을 추가하고 있습니다.

제가 원하는 동작은 아래와 같습니다.
SSR : 게임에 대한 설명
CSR : 실제 게임
입니다.

그렇다면 JavaScript 동작을 없앴을 때 게임 설명이 표시되면 해당 부분은 SSR로 동작하고 있는 것입니다.

• F12를 눌러 개발자 모드에 진입하여 설정 클릭

• Debugger -> Disable JavaScript 클릭 

위처럼 하면 현재 웹 사이트에서 JavaScript를 비활성화 한 것입니다. 이 상태로 게임을 접속해보겠습니다.
아래 링크를 확인해보면 제가 예상한대로 설명이 잘 나옵니다.
• 다이싸 게임

즉, SSR이 정상적으로 동작하고 있습니다.

게임은 시작 버튼을 클릭해야 시작이 되는 데 버튼이 클릭되지 않으니 CSR로 동작하는 것을 확인할 수 있습니다.

결론

본인이 개발한 것이 SSR, CSR로 동작하는 지 의문이 생기면 JavaScript를 비활성화해서 테스트 해보시길 바랍니다.