개요

프론트엔드는 허구헌날 트랜드가 슉슉 바뀌는 것처럼 보이지만 사실은 주기적인 기술적 순환을 거쳐 발전해 왔다. 이는 새로운 기술이 등장하는 것처럼 보여도, 종종 과거의 기술이 다시 재조명되는 과정을 통해 설명할 수 있다.

1. ActiveX(우리 회사 신입은 이게 뭔지 아예 모르더라) -> html5 -> WebAssembly
   복잡한 작업을 위해 ActiveX가 도입되었지만, 이는 윈도우와 IE에 종속적이었다. 이후 HTML5와 JavaScript가 이를 대체했으나, 고성능 작업의 필요성 때문에 WebAssembly가 다시 주목받고 있다.

2. CSS-in-JS vs 전통적인 css
   전통적인 CSS 방식과 함께, CSS-in-JS와 같은 새로운 스타일링 방식이 나타났지만, 둘 사이의 기술적 순환이 지속되고 있다.

3. 정적 사이트와 동적 웹사이트
   특히 정적 사이트에서 동적 웹사이트로의 전환, 그리고 다시 정적 사이트가 재조명되는 흐름은 웹 개발의 순환적 특성을 가장 잘 보여준다. 대표적으로 PHP와 서버 사이드 렌더링(SSR)이 Next.js와 함께 현대적으로 부활한 사례가 있다.

PHP와 서버 사이드 렌더링의 전성기

1. 웹 개발의 중심: 1990년대 후반부터 2000년대 초반까지, PHP는 서버에서 HTML을 생성하여 빠른 초기 로딩을 제공하는 동적 웹사이트의 핵심 기술이었다. 이는 사용자 경험을 크게 개선했다.
2. 쉬운 개발 과정: PHP는 HTML에 쉽게 삽입할 수 있어, 빠르고 직관적인 개발이 가능했다. 서버에서 모든 페이지를 생성하고, 사용자는 그 결과를 받아보는 방식이 일반적이었다.

클라이언트 사이드 렌더링의 등장

1. JavaScript의 발전: AJAX와 JavaScript의 진보로 복잡한 상호작용이 가능해졌고, 클라이언트 사이드에서 더 많은 처리가 이루어졌다. 이는 사용자 경험을 획기적으로 향상시켰다.
2. SPA의 등장: Angular, React, Vue.js 같은 프레임워크 덕분에 **단일 페이지 애플리케이션(SPA)**이 주류로 부상했다. 서버와의 추가 통신 없이도 페이지 간 전환이 가능해졌으며, 이로 인해 웹 애플리케이션은 네이티브 애플리케이션과 유사한 경험을 제공할 수 있었다.
3. PHP의 쇠퇴: SPA 방식이 인기를 끌면서, 전통적인 서버 사이드 렌더링의 필요성은 줄어들었고, PHP는 점차 구식 기술로 인식되었다.

서버 사이드 렌더링의 재부상: Next.js의 출현

1. CSR의 한계: 클라이언트 사이드 렌더링(CSR)은 사용자 경험을 개선했지만, 초기 로딩 지연과 SEO 문제 등 단점이 있었다. 특히, 초기 로딩 시 큰 JavaScript 번들이 필요해지면서 성능 문제가 대두되었다.
2. Next.js의 혁신: React 기반의 Next.js는 이러한 문제를 해결하기 위해 등장했다. Next.js는 SSR과 CSR의 장점을 결합해, 더 나은 초기 로딩 속도와 SEO 최적화를 제공한다.
3. 균형 잡힌 접근: Next.js는 서버에서 사전 렌더링(SSR)을 수행하면서도, 필요한 데이터를 클라이언트에서 동적으로 가져오는 CSR 방식의 융합을 가능하게 했다. 이를 통해 성능과 사용자 경험 간의 균형을 맞출 수 있게 되었다.

웹 개발 트렌드의 순환적 특성

1. 문제 해결과 새로운 과제: 새로운 기술은 기존 문제를 해결하지만, 동시에 새로운 문제를 초래한다. 예를 들어, CSR은 반응성을 개선했으나, 초기 로딩 지연과 SEO 문제를 다시 일으켰다.
2. 과거 기술의 재조명: CSR의 한계로 인해 개발자들은 다시 서버 사이드 렌더링에 주목하게 되었다. 그러나 이는 과거 방식을 단순히 반복하는 것이 아니라, 현대적인 요구에 맞게 재해석한 방식이다.
3. 기술의 융합: Next.js는 과거 PHP의 SSR 개념을 React의 컴포넌트 기반 아키텍처와 결합해, 웹 개발의 새로운 패러다임을 제시했다.
4. 사용자 중심 트렌드: 기술의 발전은 결국 더 나은 사용자 경험을 제공하는 것을 목표로 한다. PHP는 빠른 로딩을, SPA는 더 반응성 높은 인터페이스를 제공했고, Next.js는 이 둘의 장점을 결합해 최적의 사용자 경험을 제공한다.

결론

웹 개발 트렌드는 단순한 반복이 아닌, 문제를 해결하며 지속적으로 진화하는 과정이다. PHP의 SSR에서 Next.js로 이어지는 변화는 이러한 순환적 발전을 잘 보여준다. 개발자는 이러한 흐름을 이해하고, 각 기술의 장단점을 적절히 활용해 최상의 사용자 경험을 제공해야 한다.