TECH NOTES
기술노트
현장에서 검증된 개발 지식을 기록합니다.
21
Frontend
긴 목록 렌더링 최적화 — content-visibility와 가상 스크롤 중 무엇을 쓸까
수천 개 항목을 그리는 화면에서 content-visibility, contain-intrinsic-size, 가상 스크롤의 차이를 정리한다. 각 기법이 해결하는 비용의 종류와 접근성·검색·스크롤 위치 문제까지 다룬다.
Frontend
content-visibility: auto — 긴 페이지 렌더링 비용을 줄이는 CSS 한 줄
화면 밖 요소의 렌더링을 통째로 건너뛰어 긴 페이지의 초기 렌더 비용을 줄이는 CSS 속성. contain-intrinsic-size 짝 사용법과 가상화와의 차이, 스크롤바가 튀는 함정과 해결책까지 실전 위주로 정리했다.