모듈형, 고속, 경량: 서버 렌더링 IDE를 구축하는 방법

기존 IDE는 언어별로 상이한 설정을 처리하기 위해 상위 컴포넌트에 복잡한 분기 로직이 집중되어 있었고, 이는 코드 비대화와 유지보수의 어려움으로 이어졌다.

이를 해결하기 위해 Repl.it은 약 3,000 LOC 규모의 경량 코어를 새롭게 설계했다. 이 코어는 윈도우 매니저이자 이벤트 중개자 역할을 수행하며, 모든 구성 요소를 플러그인 형태로 구현했다.

새로운 아키텍처의 핵심 특징은 다음과 같다:

• 플러그인 기반 구조: 모든 구성 요소는 플러그인이며, 상태 관리(reducer)와 이벤트 처리(receiver)를 독립적으로 수행한다.
• 서버 사이드 렌더링(SSR): 느린 네트워크 환경에서도 빠른 로딩을 보장하기 위해 SSR을 필수적으로 도입했다.
• 높은 확장성: 플러그인 간 직접적인 의존성이 없어 특정 기능을 쉽게 교체하거나 확장할 수 있다.
• 디버깅 용이성: Redux를 활용해 상태 변화를 추적할 수 있으며, 타임 트래블 디버깅과 프로덕션 에러 추적이 용이하다.