2023년 웹 개발 트렌드

10 Web Development Trends in 2023 을 번역하였습니다.

(META) 프레임워크

• SPA (Single-page applications) 이 다소 몇 년간 인기를 얻어왔다.

• Meta 프레임워크가 등장하면서, CSR(Client Side Rendering)에서 SSR(Server Side Rendering)으로 흐름이 바뀐 것을 확인할 수 있다.

  여기서 Meta Framework (메타 프레임워크)라는 것은 SSR을 의미한다.

• SSR 은 오늘날 모든 프레임워크와 함께 동작하고 있다.

• 가장 유명한 프레임워크는 Next.js 이다.

• 비록, React.js 팀도 SSR 제공을 위해 라이브러리를 제공하거나 Vercel(Next.js 회사)과 긴밀하게 협조하고 있지만, React.js가 프론트에서 지속적 인기를 가질 것이라고 장담할 순 없다.

• Remix이라는 새로운 프레임워크가 등장하면서 React.js에서 Meta Framework로 변하는 흐름이 아니라 다른 접근법을 가진 프레임워크가 등장할 수도 있다.

• 눈 여겨 보면 좋을 프레임워크
  • Svelt
  • SolidStart

애플리케이션과 리렌더링 패턴

• 지난 10년 간 (2010-2020) client-side rendering(CSR) 에서 SPA (Single-Page Application)가 주도하였다.

• 작년, server-side rendering (SSR) 에 대한 흥미가 증가하기 시작하면서 다시 multi-page application(MPA)가 다시 주목받기 시작하고 있다.

• 다른 점이 있다면 과거에는 Java나, Ruby on Rails 기반의 SSR 이었다면, 현재는 JavaScript 중심의 SSR이라는 것이다.

현재의 트렌드

• 그런데 여기서 주목할 점은 SSR 조차도 트렌드라고 할 수는 없다는 점이다

• SSR, SSG는 최적화의 관점에서 트렌드이긴 했지만 ISR나, Streaming SSR이 현재 주목을 받고 있다.

  • SSG(Static Site Generation): 실행되기 전에 한 번 빌드된 상태, static

  • ISR(Incremental Static Regeneration): 전체 웹 사이트를 리빌딩하는 대신에 페이지당 기본이되는 부분을 정기적으로(대략 60초 별로) 리빌딩하는 것

    60초마다 리빌딩한다는 것은, 많은 API 요청을 보낸다는 것이고 기존의 REST API 요청역시 네트워크와 서버 측면에서 부하로 인해 부담스러울 수 있다.

  • Streaming SSR (On-Demand ISR): 애플리케이션이 API에 노출되었을 때만 리빌딩 되는 것 (e.g. CMS)

• Streaming SSR의 장점은 서버 사이드 렌더링의 Single-threaded bottleneck을 줄여준다는 것이다.
  • 본래 SSR은 한 번 클라이언트로 컨텐츠를 렌더링하여 데이터를 보낸다.
  • Streaming SSR은 청크 단위로 애플리케이션을 나누어서 서버에서 클라이언트로 병렬적이고 지속적으로 요청을 보낼 수 있다.