Loading...
홈 › 블로그

IT 개발 블로그 — REDINFO

반응형 컴포넌트 layout 깨짐 해결 - CSS Container Queries로 미디어 쿼리 한계 완벽 해결

웹 애플리케이션을 개발하다 보면 사이드바, 모달, 메인 콘텐츠 영역 등 다양한 위치에서 재사용되는 카드 컴포넌트의 레이아웃이 지저분하게 깨지는 현상을 경험해봤을 것이다. 다만 대부분의 개발자들은 뷰포트 기준 미디어 쿼리의 한계 때문이라는 정확한 원인이나 해결책을 모르는 경우가 많다.이번에는 CSS Container Queries가 정확히 뭔지, 왜 필요한지···

39 0
JavaScript ResizeObserver API로 반응형 컴포넌트 크기 감지 - window.onresize 성능 한계 완벽 해결

웹 애플리케이션을 개발하다 보면 특정 DOM 요소나 카드 컴포넌트의 크기가 변경될 때 내부 레이아웃이나 차트를 재선언해야 하는 상황을 경험해봤을 것이다.다만 대부분의 개발자들은 여전히 window 객체의 resize 이벤트를 바인딩하여 브라우저 전체 창이 바뀔 때만 대응하거나, setInterval 타이머를 돌려 크기를 체크하는 비효율적인 방식을 사용하고 ···

24 0
REDINFO Since 2014
webmaster@redinfo.co.kr
Copyright © Redinfo All Rights Reserved