✦ Bloom Filter Visualizer — probabilistic membership, collisions, false positives

An interactive, single-file Bloom filter that runs entirely in your browser — no backend, no build step.

▶ Live: https://dev48v.github.io/bloom-filter/

A Bloom filter answers "have I seen this?" using a tiny bit array — trading a small, tunable chance of false positives for huge space savings. This makes the whole mechanism visible.

How it works

• A shared array of m bits, all 0.
• k hash functions map each key to k positions.
• add(key) → set those k bits to 1.
• check(key) → test those k bits:
  • any bit still 0 → the key was definitely not added (a bit it would have set is untouched).
  • all bits 1 → the key is possibly present (they might all have been set by other keys).

The one-way guarantee: no false negatives. If you added a key, all its bits are 1, so check always says "possibly present." But as the array fills, unrelated keys can collide on all k bits — a false positive.

Try it

1. add sample set, then 🎯 find a false positive — the app hunts for a word you never added whose k bits are all set by others, and the filter reports possibly present. That's the trade, live.
2. Add a key, then check it — always "possibly present" (never a false negative).
3. Check a nonsense key — almost always "definitely not present".
4. Slide m (bits) and k (hashes) and watch the estimated false-positive rate move. More bits → fewer collisions → lower error.

The math

The estimated false-positive rate after adding n items is:

p ≈ (1 − e^(−kn/m))^k

There's an optimal k for a given m and n (k = (m/n)·ln2) — too few hashes and collisions are likely, too many and you fill the array too fast. The demo shows the live estimate so you can feel the trade-off.

Where they're used

Databases (skip a disk read for keys that are "definitely not here"), CDNs and caches, browsers checking URLs against a huge blocklist without downloading it all, and distributed systems avoiding expensive lookups. Anywhere a cheap "probably / definitely not" beats an exact but expensive answer.

The k hashes use double hashing (h_i = h1 + i·h2 mod m), the standard trick for k independent-ish hashes from two base hashes.

Run locally

It's one file. Open index.html, or:

python -m http.server 8000   # then visit http://localhost:8000

License

MIT © 2026 dev48v — dev48v.infy.uk