HomeCryptographyMerkle Tree — Hash Trees & Proofs

🌳 Merkle Tree — Hash Trees & Proofs

Build a Merkle tree by hashing data blocks pairwise up to a single root. Change a leaf and watch the root change; verify a block with a logarithmic Merkle proof — the backbone of blockchains.

Cryptography3DModerate60 FPS
merkle-tree ↗ Open standalone

About this simulation

This simulation builds a Merkle tree live in your browser: every data block becomes a leaf hash, adjacent hashes are paired and hashed again level by level, and the process repeats until a single Merkle root remains. Edit any block and watch the change ripple upward along the path to the root, or request a Merkle proof to verify one leaf belongs under that root using only O(log n) sibling hashes.

🔬 What it shows

The canvas draws every level of the tree from leaves at the bottom to the single root at the top, connecting each pair of children to their parent. Editing a data block box recomputes its leaf hash and highlights the changed path to the root in red, demonstrating that a Merkle tree is tamper-evident: no leaf can change without the root changing too.

🎮 How to use

Type into any Data blocks text field to change that leaf's content and watch the root hash update. Drag the Leaves slider (2–16) to resize the tree, then pick a Leaf index and click Verify leaf to build and highlight a Merkle proof: the sibling hash at each level (amber) plus the path to the root (purple), with the proof size shown in the Stats panel. Clear highlight resets the view.

💡 Did you know?

Bitcoin and Ethereum store a Merkle root in every block header so that a lightweight client can verify a single transaction is included in a multi-thousand-transaction block using only about twenty sibling hashes — a proof size that barely grows even if the block held a million transactions, since proof length scales as O(log n).

More questions about Merkle trees

Why does this simulation use a short FNV-1a hash instead of SHA-256?

The simulation swaps in a small, fast FNV-1a-style mixing function that produces a 4-hex-digit id instead of a full 256-bit SHA-256 digest, purely so the hashes are readable on screen and recompute instantly as you type. The tree-building algorithm, the tamper-evidence property, and the O(log n) proof logic are identical to production systems; only the underlying hash function differs.

What happens to the tree when the number of leaves is not a power of two?

At any level with an odd node count, the simulation's buildTree function pairs the last node with a copy of itself before hashing, which is exactly the duplicate-last-node rule used in real Merkle tree implementations such as Bitcoin's. This keeps every level binary so the tree always reduces cleanly to a single root, regardless of whether the leaf count (2 to 16 in this demo) is a power of two.

How is the changed path different from the proof path in the visualisation?

Editing a leaf triggers markChangedPath, which walks from that leaf up to the root marking every ancestor red to show which hashes were recomputed. Clicking Verify leaf instead triggers buildProof, which marks the path to the root in purple and marks the sibling hash needed at each level in amber — the minimal set of extra hashes a verifier needs to recompute the root from that one leaf, without seeing any other block.

Why is a Merkle proof only O(log n) hashes long?

Each level of the tree halves the number of nodes, so a tree of n leaves has about log2(n) levels. A proof needs exactly one sibling hash per level on the path from leaf to root, so its size grows logarithmically rather than linearly with the number of leaves — for a million leaves that is roughly 20 hashes, letting a light client verify inclusion without downloading the other 999,999 blocks.

Could two different leaves ever produce the same tree root?

In principle a hash collision could make two different datasets produce the same root, but with a cryptographically secure hash such as SHA-256 this is computationally infeasible — the demo's simplified FNV-1a-style function is not collision-resistant and is used here only for speed and readability, never for real integrity guarantees.

⚙ Under the hood

Build a Merkle tree by hashing data blocks pairwise up to a single root. Change a leaf and watch the root change; verify a block with a logarithmic Merkle proof — the backbone of blockchains.

Merkle treehash treeproof of inclusionblockchainCanvas 2D

3D · Three.js / WebGL renderer · 60 FPS target · runs fully client-side, no install

What did you find?

Add reproduction steps (optional)