앞서서..

이 글은 React.js의 컴포넌트, UI 구성 요소들이 클라이언트와 서버 중 어느 부분에서 실행되어야 하는지에 대한 고민을 담은 React.js 개발자 dan abramov의 글 The Two Reacts과 이를 한국어로 번역한 Saetbyeol님의 글을 기반으로.

제가 글을 이해하기 위해 작성한 정리 내용입니다. 글의 서순 등이 원문과 다르니, 정확한 내용 파악을 위해서는 반드시 원 출처의 글을 참고해주시기 바랍니다.

1. 판단 기준

고민의 결론을 내리기 전에, 우선 알아두어야 할 판단 기준은 아래와 같습니다.

• 사용자에게 좋은 사용경험을 제공해주기 위해서는. UI와 상호작용을 할때, 시간 지연없는 즉각적인 반응이 이루어져야 한다.

• UI 구성에 필요한 데이터는 경우에 따라 클라이언트 혹은 서버에 각각 존재한다. 따라서 어느 지점에서 컴포넌트를 실행하는지 여부에 따라 장단점이 다르게 존재한다.

2. 클라이언트에서 실행되어야 한다

만약 사용자가 UI를 클릭했는데, 바로 반응이 없다면?
사용자는 애플리케이션이 제대로 동작하지 않는다고 판단할 수 있습니다.

그렇기에, 첫 번째 시각은 UI는 사용자가 상호작용을 하자마자 즉각적으로 반응해야하며 이를 위해서 구성 요소들이 클라이언트에서 실행되어야한다는 것입니다.

클라이언트 측에서 구성 요소가 실행되면, 서버와의 통신 지연 없이 빠르게 반응할 수 있기 때문입니다.

3. 서버에서 실행되어야 한다

그런데 UI를 구성하는데 어떤 데이터들이 필요하다면? 그 데이터들이 서버에만 존재한다면? 구성 요소들이 클라이언트에 존재해봐야 데이터에 빠르게 접근할 수가 없어 UI를 제대로 구성할 수가 없습니다.

두 번째 시각은 UI 구성에 필요한 데이터들을 지연이나 제한 없이 바로 가져와야한다는 것이며 이를 위해서 구성 요소들이 서버에서 실행되어야 한다는 것입니다.

서버 측에서 구성 요소가 실행되면, 필요한 데이터들을 미리 처리해서 클라이언트로 묶어 전송하여 네트워크 사용을 최소화할 수 있기 때문입니다.

4. 결론은..

두 접근 방식은 각자 다른 장단점을 가지고 있고, 이들의 장점을 뽑아서 사용한다는 것은 불가능한 일입니다.

클라이언트 측 접근 방식은 즉각적인 상호작용에 적합하지만, 서버에서만 실행할 수 있는 API를 사용하는 구성 요소는 처리할 수 없습니다. 반대로, 서버 측 접근 방식은 데이터 처리에 효율적이지만, 실시간 상호작용을 제공하지 못하기 때문입니다.

이상적으로는 프로그래밍 패러다임이 클라이언트와 서버 양쪽에서 구성 요소를 효과적으로 처리할 수 있게 되어야 겠지만, 지금 시점에서는 현실화되지 않은 일입니다.

• 취준생 시점에서는.. 더 똑똑한 개발자들이 더 진보된 개발방법을 만들어내기 전까지는, 둘 다 해보고 내가 편하거나 프로젝트 요구사항에 더 적합한 방법을 취사선택해보는게 최선이라고 생각합니다..