Trees show up constantly in frontend; BSTs almost never do directly — but the underlying ideas (order, search, balance) show up disguised as caches and indexes.

Where trees appear in frontend

• DOM — itself a tree. Walking it (querySelectorAll, custom traversals), measuring it, diffing it.
• Virtual DOM / React fiber — React's reconciliation diffs two trees.
• Component trees — render trees, context propagation.
• File explorers, folder trees, org charts, nested menus, sidebar nav.
• Comment threads / replies — recursive nesting.
• Category trees — e-commerce taxonomies.
• JSON / AST — config viewers, code editors, syntax highlighters.

Common operations you need to know

• DFS (recursion or explicit stack) — render a tree, find a node, flatten, sum a value.
• BFS (queue) — level-order: "show first N levels", shortest path.
• Tree map/filter — transform a tree preserving structure.
• Find ancestors / path to a node — for breadcrumbs.
• Flatten (flat/recursive) — convert nested → flat list with depth.

function walk(node, fn) {
  fn(node);
  (node.children || []).forEach((c) => walk(c, fn));
}

Where BSTs come up

Rarely as literal binary search trees. But the idea shows up:

• Maintaining a sorted list with fast insert/lookup — usually a Map + array, or a library.
• Range queries — e.g., a calendar UI finding events in a window.
• LRU caches — doubly linked list + hash map, not a BST, but same "ordered structure" instinct.

Interview framing

"Trees are everywhere in frontend — the DOM, the virtual DOM, component hierarchies, comment threads, file trees, category navigation. The operations I reach for are DFS (recursion) for transforms and finds, BFS for level-order, plus tree-flatten and path-finding. BSTs themselves rarely come up directly in frontend — when I want ordered lookup I use a Map or a sorted list — but the underlying ideas (search, balance) show up in caches and indexes."