피드로 돌아가기
I built a virtual-scroll custom element that behaves like a normal scroll container
Dev.toDev.to
Frontend

Native HTML/CSS 동작을 유지하는 Virtual Scroll Custom Element 설계

I built a virtual-scroll custom element that behaves like a normal scroll container

Joshua Amaju2026년 4월 14일1intermediate

Context

기존 Virtual Scrolling 솔루션의 Framework 의존적인 API 설계와 Absolute Positioning 기반의 부자연스러운 Layout 패턴이 개발 경험을 저해하는 한계점 발견.

Technical Solution

  • Framework 독립적인 구현을 위한 Web Components 기반의 Custom Element 설계
  • Native Scroll Container와 동일한 UX 제공을 위한 표준 HTML/CSS 동작 방식 채택
  • Absolute Positioning 배제를 통한 자연스러운 Layout Flow 유지 및 렌더링 구조 최적화
  • 라이브러리 기능이 아닌 Platform Primitive 수준의 인터페이스 구현으로 범용성 확보

1. Virtualization 도입 시 Absolute Positioning이 Layout에 주는 제약 사항 검토

2. 특정 Framework 종속성을 낮추기 위한 Web Components 활용 가능성 분석

3. 라이브러리 API 수준이 아닌 Native 플랫폼 표준에 가까운 인터페이스 설계 지향

원문 읽기