JavaScript Tax 제거, HTMX로 구현하는 고효율 ASP.NET Razor Pages

Context

과도한 SPA 프레임워크 도입으로 인한 아키텍처 복잡도 증가. 데이터 중심 비즈니스 애플리케이션에 부적합한 클라이언트 사이드 오버헤드 발생. 프론트엔드와 백엔드 간의 빈번한 컨텍스트 스위칭 및 개발 비용 상승.

Technical Solution

• HTML 속성을 활용해 AJAX, WebSockets, Server-Sent Events를 직접 제어하는 HTMX 도입
• JSON 파싱 및 클라이언트 렌더링 과정을 생략하고 서버에서 HTML Fragment를 직접 반환하는 구조
• PageModel의 handler에서 PartialViewResult를 반환하여 필요한 UI 부분만 동적으로 교체하는 방식
• npm, webpack, vite 등 별도의 빌드 단계가 필요 없는 Zero-build 환경 구축
• 서버 사이드 C# 코드를 단일 진실 공급원(Source of Truth)으로 유지하는 타입 안전성 확보
• hx-post, hx-target 등 표준 HTML 확장 속성을 통한 선언적 인터랙션 설계

Key Takeaway

UI 로직을 데이터와 가까운 서버로 이동시켜 개발 복잡도를 낮추는 Server-First 아키텍처의 효율성 확인. 모든 인터랙티브 웹이 반드시 무거운 SPA 프레임워크를 필요로 하지 않는다는 설계 원칙 제시.