대화 상자(Dialog) 유형
Modal - 상호작용 차단
- System Modal: 닫기 전까지 다른 작업 불가
- Application Modal: 프로그램 일시 중단
- Document Modal: 부모 창만 차단 (macOS 시트)
Modeless - 상호작용 허용 (예: 툴바)
모달은 워크플로우 방해 → 비필수 작업에는 모델리스 선호1
313.md 참고
Footnotes
-
Dialog box - Wikipedia: “A modal dialog interrupts the main workflow.” / “Non-modal or modeless dialog boxes are used when the requested information is not essential to continue…” ↩
검색어 필터링 UI → Debounce (300-500ms)
타이핑 완료 후 검색이 더 자연스러움. “자바스크립트” 입력 시 매 글자마다 검색하면 비효율적. Debounce 는 호출이 멈출 때까지 기다리고, Throttle 은 계속 호출돼도 정해진 최대 빈도로 실행한다.1
const handleSearch = debounce((term) => performSearch(term), 300)
input.addEventListener('input', (e) => handleSearch(e.target.value))Throttle은 실시간 검색 결과를 보여주면서 요청 제한할 때 사용 (1초마다 최대 1회 등).
Footnotes
-
Debounce - MDN Glossary: “The key difference is that throttling enforces limits on continuous operations, while debouncing waits for invocations to stop for a specific time to consolidate many noisy invocations into one single invocation.” ↩