Visualizers

Learn by moving things

Interactive explainers for the ideas behind retrieval, embeddings, and agents. A formula tells you what is true; dragging a vector shows you why. Each one also appears inside the article it belongs to, and runs entirely in your browser, so drag, poke, and break it.

Portrait of Sachin Gupta rendered in binary

Follow the documented Azure preFilter stages through two fictional shards and a merge. Exact toy rankings make the result inspectable; this is not an HNSW simulation.

A CONCRETE ENGINE EXAMPLE · AZURE preFilter

The badge travels into the search.

Illustrated stages, fictional shard assignments, and exact toy rankings. This does not implement or simulate HNSW.

THE SERVER SENDS THE CONDITION WITH THE QUERY

Company Sachin AND (user maya is directly granted OR a group matches support)

vectorFilterMode: "preFilter" · k: 2

Shard A one portion of the index

D2.1Label attached98 pts
D1.1Label attached94 pts
D3.1Label attached90 pts
D3.2Label attached86 pts
D4.2Label attached82 pts

Waiting for the query and filter.

Shard B one portion of the index

D4.1Label attached96 pts
D2.2Label attached92 pts
D1.2Label attached88 pts
D1.3Label attached84 pts
D3.3Label attached80 pts

Waiting for the query and filter.

GLOBAL RESULT · REQUESTED 2
Continue to the merge stage

The application supplies a filter derived from trusted identity. An arbitrary client group list is not authority.

The drawn records expose fictional labels for teaching. They do not depict graph edges or a real traversal order. Selective filters may require more traversal work. Read Azure’s filter-mode stages and tradeoffs ↗

Inspect shard inputs and merged output
{
  "principal": {
    "id": "maya",
    "name": "Maya",
    "role": "Support",
    "tenantId": "sachin",
    "groups": [
      "support"
    ]
  },
  "k": 2,
  "shards": [
    {
      "name": "A",
      "input": [
        "D2.1",
        "D1.1",
        "D3.1",
        "D3.2",
        "D4.2"
      ],
      "localResult": [
        "D1.1",
        "D3.1"
      ]
    },
    {
      "name": "B",
      "input": [
        "D4.1",
        "D2.2",
        "D1.2",
        "D1.3",
        "D3.3"
      ],
      "localResult": [
        "D1.2",
        "D1.3"
      ]
    }
  ],
  "globalResult": [
    "D1.1",
    "D3.1"
  ]
}

Change the source permission while the search copy and cached answer lag behind. See which check prevents stale access.

YOUR TURN · CHANGE ONE INPUT

Follow the three clocks.

Fictional records. Browser simulation. No live model call.

SOURCE POLICY

Version 2

Arun: deny

groups: []
SEARCH COPY

Version 1

Index label: allow

Stale: source is already v2
CACHED ANSWER · V1

Still stored

Not usable

Reuse requires current permission and version match.

D2 stays out of the context. The owner’s denial is respected even while old copies exist.

Inspect the input, rule, and output

Input / state

{
  "stage": 1,
  "currentCheck": true,
  "reader": {
    "id": "arun",
    "name": "Arun",
    "role": "Engineering",
    "tenantId": "sachin",
    "groups": [
      "engineering"
    ]
  },
  "source": {
    "id": "D2",
    "title": "Engineering incident note",
    "team": "Engineering",
    "tenantId": "sachin",
    "allowedGroups": [],
    "allowedUsers": [],
    "match": 98,
    "fact": "Sign-in requests time out under peak load. The identity team is fixing the session refresh path.",
    "aclVersion": 2
  },
  "indexed": {
    "id": "D2",
    "title": "Engineering incident note",
    "team": "Engineering",
    "tenantId": "sachin",
    "allowedGroups": [
      "engineering"
    ],
    "allowedUsers": [],
    "match": 98,
    "fact": "Sign-in requests time out under peak load. The identity team is fixing the session refresh path.",
    "aclVersion": 1
  }
}

Decision rule

contextIncludesD2 = indexAllows
  && (!currentCheckEnabled || currentAllows)
cacheUsable = oldEntryExists
  && cacheVersion === sourceVersion
  && currentAllows

Output

{
  "source": {
    "id": "D2",
    "title": "Engineering incident note",
    "team": "Engineering",
    "tenantId": "sachin",
    "allowedGroups": [],
    "allowedUsers": [],
    "match": 98,
    "fact": "Sign-in requests time out under peak load. The identity team is fixing the session refresh path.",
    "aclVersion": 2
  },
  "indexed": {
    "id": "D2",
    "title": "Engineering incident note",
    "team": "Engineering",
    "tenantId": "sachin",
    "allowedGroups": [
      "engineering"
    ],
    "allowedUsers": [],
    "match": 98,
    "fact": "Sign-in requests time out under peak load. The identity team is fixing the session refresh path.",
    "aclVersion": 1
  },
  "indexAllows": true,
  "currentAllows": false,
  "oldCacheExists": true,
  "cacheUsable": false,
  "contextIncludesD2": false,
  "cacheVersion": 1,
  "policyVersion": 2
}

This view runs the same deterministic functions as the downloadable example. The short rule above summarizes the operation; the download contains the complete implementation.

Inspect citations, previews, shared answers, and operator diagnostics using the reader’s permissions.

YOUR TURN · CHANGE ONE INPUT

Inspect the letter, envelope, and ledger.

Fictional records. Browser simulation. No live model call.

D2 citation

Maya receives
{
  "status": 404,
  "body": {
    "message": "Source unavailable"
  }
}

The source route checks this reader’s current access to D2.

All records and the token are fictional. Showing the unchecked path is an intentional teaching view, not a real source endpoint.

Inspect the input, rule, and output

Input / state

{
  "reader": {
    "id": "maya",
    "name": "Maya",
    "role": "Support",
    "tenantId": "sachin",
    "groups": [
      "support"
    ]
  },
  "surface": "citation",
  "checkedPath": true
}

Decision rule

look up source within reader.tenantId
check current grants before returning title or text
denied or absent → identical 404 body

Output

{
  "status": 404,
  "body": {
    "message": "Source unavailable"
  }
}

This view runs the same deterministic functions as the downloadable example. The short rule above summarizes the operation; the download contains the complete implementation.

Visualizers — Sachin Gupta