Mutex

No. 13 · SVG · Tank and key

Tap a pumptap the key

A water tank filled by two pumps. Without the interlock key both controllers read the same level and overfill it; with it, only the one holding the key may read and run.

Prompt

/anatomy explain how a mutex prevents a race condition, interactive

Install

npm install anatomy-figures

In your code

page.tsx

import { Mutex } from "anatomy-figures";

<Mutex theme="light" />

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

page.tsx

import Mutex from "anatomy-figures/mutex";

Theme it

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

page.tsx

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

Without React

index.html

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

define();

<anatomy-mutex theme="light"></anatomy-mutex>