Bloom filter

No. 08 · SVG · Fruit machine

Pick a coinpull or press

A fruit machine. Three reels are the three hash functions and a row of sixteen flags is the bit array; it pays out only when all three of a word's flags are already up.

Prompt

/anatomy explain how a bloom filter works, interactive

Install

npm install anatomy-figures

In your code

page.tsx

import { BloomFilter } from "anatomy-figures";

<BloomFilter theme="light" />

Or load this figure on its own, so the others never download:

page.tsx

import BloomFilter from "anatomy-figures/bloom-filter";

Theme it

Five themes (dark, light, paper, blueprint, sepia), or your own colours through tokens. Every token.

page.tsx

<BloomFilter
  theme="light"
  tokens={{
    "--anatomy-card": "#ffffff",
    "--anatomy-lit": "#e5484d",
  }}
/>

Without React

index.html

import { define } from "anatomy-figures/element/bloom-filter";

define();

<anatomy-bloom-filter theme="light"></anatomy-bloom-filter>