Design typeahead autocomplete

medium

Complete guide with examples and interview questions · 40 min

Definition

Say it out loud in an interview — clear, simple, no textbook wording.

If someone asks me to design autocomplete, I would say it is a text input that suggests completions as you type, and the whole design is about not fetching too much, not showing stale results, and letting the keyboard do the work. The input looks simple. The race conditions underneath it are not.

Interviewers care because autocomplete is the smallest question that exposes async discipline. Debouncing, cancellation, caching, and keyboard handling all fit in one component, and every one of them has a visible failure mode when done wrong.

The senior nuance is ordering. A slow response for an old query must never overwrite results for the current query. If you can explain exactly how you guarantee that, you have answered the hardest part of the question.

Quick Stats
40
Minutes
medium
Difficulty
5
Interview Q's

Key takeaways

  • Debounce input, then cancel stale requests, or suggestions will arrive out of order
  • Every keystroke is not a request: cache prefixes and reuse them
  • Keyboard navigation is part of the design, not an accessibility extra
  • Highlight the matching text so the user can scan suggestions at a glance
  • A suggestion list must close predictably on blur, escape, and selection

Track your mastery

Sign in to save Q&A scores, coding challenge progress, points, and streaks across devices.

Sign in to save progress