Binary Search Tree (BST) Visualizer
Step-by-step visualization of Binary Search Tree operations — insert, delete (all 3 cases: leaf, one child, two children + successor), and search — with animated comparison path. All four traversals (in-order, pre-order, post-order, level-order) with synchronized node highlighting and output. Live height, node count, balance factor per node, degenerate-tree warning for sorted input, successor / predecessor highlighting, bulk insert from a list, and shareable tree-state URLs. 100% client-side.
About Binary Search Tree (BST) Visualizer
Step-by-step visualization of Binary Search Tree operations — insert, delete (all 3 cases: leaf, one child, two children + successor), and search — with animated comparison path. All four traversals (in-order, pre-order, post-order, level-order) with synchronized node highlighting and output. Live height, node count, balance factor per node, degenerate-tree warning for sorted input, successor / predecessor highlighting, bulk insert from a list, and shareable tree-state URLs. 100% client-side. Everything runs locally in your browser — your data never leaves your device.
How to use
- Enter your input in the tool above.
- Adjust any options to your preference.
- Use the Copy or Download buttons to save the result.
- Everything happens locally — your data never leaves your browser.
FAQ
How does the BST visualizer work?
Every operation (insert, delete, search, traversal) is implemented as a JavaScript generator function that yields a Step object on each comparison, link update, or visit. Each step carries a full snapshot of the tree structure (as a serializable node list with parent / left / right links), the active comparison node, and the running output sequence — so the UI can step forward and backward without re-running. The play head animates through the steps at your chosen speed, color-coding the active comparison path, successor / predecessor nodes, and traversal order.
What are the three deletion cases and how are they animated?
(1) Leaf node — simply unlink from its parent. (2) One child — splice the child up into the deleted node's slot, preserving the BST property. (3) Two children — find the in-order successor (leftmost node of the right subtree), copy its value into the deleted node's slot, then recursively delete the successor (which falls into case 1 or 2). The visualizer walks the comparison path down, highlights the successor in amber, then animates the splice / copy / unlink.
How is balance factor computed and why does it matter?
Balance factor = height(left subtree) − height(right subtree). A BST is balanced when every node's balance factor is in {-1, 0, 1}. When you insert sorted input (1, 2, 3, 4, 5…), each new node lands on the right spine and the tree degenerates into a linked list — O(n) height, O(n) lookup. The visualizer flags a degenerate tree with a warning banner, and every node displays its balance factor so you can see exactly where the imbalance lives. This motivates self-balancing trees like AVL and Red-Black.
Can I bulk-insert values and what about duplicates?
Yes — paste a comma / space / newline separated list into the bulk-insert box and click Insert. The tool parses integers, ignores invalid tokens, and animates each insert in sequence. Duplicate keys are silently skipped (standard BST policy) and the info panel reports how many were skipped. You can also randomize a fresh tree (10 / 25 / 50 nodes) or load a sorted-input preset to see degeneration.
What extra features does this tool have versus other BST visualizers?
(1) Insert / delete / search with animated comparison path. (2) All 3 deletion cases animated with successor highlighting. (3) All 4 traversals (in / pre / post / level-order) with synchronized node highlighting and output sequence. (4) Live height, node count, and per-node balance factor. (5) Degenerate-tree warning for sorted input. (6) Bulk insert from a list. (7) Reingold-Tilford-style tree layout (proper x / y coordinates). (8) SVG rendering with comparison-path and successor highlights. (9) Step / play / pause / speed controls with reverse-step fidelity. (10) Random-tree and sorted-tree presets. (11) History (localStorage, last 20). (12) Shareable URL encoding the entire tree state. (13) Color legend. (14) Export traversal output as text. 100% client-side — no uploads, no ads.
Related tools
.bashrc / .zshrc Alias & Config Manager
Build shell aliases, functions, exports, and PATH edits in a visual editor, then export a clean, commented .aliases file sourced from both .bashrc and .zshrc — with shadowing detection against shell builtins and common CLI tools, function suggestions when args are needed, starter packs (git, docker, kubectl, navigation, safety, ls, dev, devops, data science), import of existing rc files, dedupe, history (localStorage), and shareable URL. 100% client-side.
Add / Subtract Date Calculator
Add or subtract years, months, weeks, days, hours, minutes and seconds from a starting date/time. Calendar-day or business-day mode with custom weekend + holiday list. Month-end policy toggle (clamp to last day vs overflow). Repeat/series mode (e.g. every 2 weeks x 10) with CSV export. Shareable URL. 100% client-side.
Age Calculator
Calculate exact age from a birth date in calendar years/months/days (no negative-day bugs) plus totals in months/weeks/days/hours/minutes/seconds. Next-birthday countdown with weekday. Feb-29 birthday policy toggle. Milestones (1,000 days, 10,000 days, 1 billion seconds). Zodiac sign + Chinese zodiac. Age gap comparison. Shareable URL. 100% client-side.