Exercise 2: No Debounce Needed, and When That Stops Being True — Possible Solution ==================================================================== WHY NO DEBOUNCE IS NEEDED HERE ------------------------------ Debouncing exists specifically to avoid firing a network request on every single keystroke, when each keystroke would otherwise trigger a new API call. This chapter's approach loads the entire (realistically small) item history from Firestore exactly once, when the component mounts, and keeps it in local React state from then on. Every subsequent keystroke in the search box only re-filters that already-loaded array in plain JavaScript, using .includes() - there is no network call happening per keystroke at all, so there's nothing to debounce. WHEN CLIENT-SIDE FILTERING STOPS BEING THE RIGHT APPROACH ------------------------------ Per this chapter, client-side filtering is the right call specifically because a personal pantry tracker's item history realistically holds at most a few hundred items - small enough to load entirely into memory without any real performance cost. If the dataset ever grew to the point where loading the full history up front became impractical (thousands of items per user, for instance), the chapter names a dedicated search service like Algolia, Typesense, or Meilisearch - mirrored from Firestore via a Cloud Function trigger - as the genuinely scalable answer instead. WHY THIS WORKS AS AN ANSWER ------------------------------ It correctly explains that debouncing is unnecessary because filtering happens entirely in memory against an already-loaded dataset rather than through per-keystroke network requests, and correctly identifies data volume (realistically small vs. genuinely large) as the specific condition that would change which approach is appropriate.