그알것 — 그럼에도 알아야 할 것들
홈질문커뮤니티
로그인
그알것 — 그럼에도 알아야 할 것들

Service

  • 홈
  • 소개
  • 질문
  • 커뮤니티

My

  • 내 워크스페이스
  • 저장한 질문
  • 작성한 답변

Policy

  • 이용약관
  • 개인정보처리방침
  • 문의

© 2026 그알것 · What Still Matters

질문 목록JavaScript
JavaScript

디바운스와 쓰로틀에 대해서 각각 설명해주세요

실무4/5
설계4/5
인간3/5
기초2/5

면접관의 질문 의도

두 단어 정의만 외운 사람인지, 기능별 패턴과 leading/trailing 옵션까지 묶어 선택 기준을 설명하는 사람인지를 가른다.

큐레이션 답변

학습 자료

디바운스는 마지막 이벤트 이후 일정 시간 동안 추가 입력이 없을 때 _한 번 실행_하는 방식이라 검색 자동완성·입력 검증처럼 "최종값"이 중요한 경우에 적합하다. 쓰로틀은 이벤트가 계속 발생해도 _일정 간격으로 실행을 제한_해 스크롤·리사이즈처럼 지속 반응이 필요한 상황에서 유리하다. 실무에서는 leading/trailing 옵션, cancel/flush 지원 여부까지 함께 설계해야 UX가 어색해지지 않는다. 즉 선택 기준은 단순 빈도 제어가 아니라 _즉시 반응성 vs 요청 절감_의 균형이다.

좋은 답변 구조

  1. 01디바운스·쓰로틀의 핵심 차이 축("최종값" vs "꾸준한 반응")을 먼저 정의한다
  2. 02검색 자동완성·스크롤·리사이즈 같은 기능별 적합 패턴을 균형 있게 설명한다
  3. 03leading/trailing·flush/cancel 같은 옵션이 결정을 어떻게 바꾸는지 조건으로 짚는다
  4. 04백엔드 부하·UX 요구가 다를 때의 최종 기준으로 마무리한다

자주 실수하는 포인트

기능 패턴 없이 "입력엔 디바운스, 스크롤엔 쓰로틀"만 외워 말한다
leading/trailing 옵션 차이가 UX에 미치는 영향을 빠뜨린다
디바운스 끝 시점에 flush가 없어서 "검색이 한 글자 빠진 채" 나가는 케이스를 모른다
성능 절감 효과만 말하고 사용자 체감 반응성 영향을 짚지 못한다

실무 맥락

  • 검색 자동완성에서 입력마다 API를 보내 백엔드 부하가 튀는 상황
  • 무한 스크롤/리사이즈 이벤트로 메인 스레드가 막혀 프레임이 떨어지는 화면
  • 버튼 중복 클릭/저장 폭주를 막아야 하는 폼 제출 처리

본인 경험에 녹이는 힌트

검색 자동완성에서 디바운스+flush 조합으로 마지막 입력까지 보장한 경험이 있다면 옵션 조합의 이유를 그대로 답변 후크로 쓸 수 있다

스크롤 핸들러에 쓰로틀을 적용해 프레임을 살려본 적이 있다면 측정 지표와 함께 말할 수 있다

leading=true로 "첫 클릭은 즉시 반응"을 유지해본 적이 있다면 UX 우선 케이스로 연결할 수 있다

커뮤니티 인기 답변

전체 0개

아직 공개된 답변이 없어요. 첫 공개 답변을 남겨보세요.

관련 꼬리 질문

Q1무한 스크롤에서 디바운스를 쓰면 어떤 문제가 생기나요
Q2leading/trailing 옵션은 어떤 차이를 만들나요
Q3디바운스와 쓰로틀을 함께 쓰는 경우도 있나요
아직 답을 쓰지 않았어요.
큐레이션 답변과 다른 사람 답변을 보고, 자기 언어로 답을 정리해보면 학습 효과가 가장 큽니다.
목차
  • 01면접관의 질문 의도
  • 02큐레이션 답변
  • 03좋은 답변 구조
  • 04자주 실수하는 포인트
  • 05실무 맥락
  • 06본인 경험에 녹이는 힌트
  • 07커뮤니티 인기 답변준비중
  • 08관련 꼬리 질문