Spaces:
Running
Running
deploy(hf): sync szl-holdings/a11oy@main derived COPY set
Browse filesReusable Dockerfile-COPY-derived deploy from szl-holdings/a11oy main.
Files: 878 Pruned: 0
Derived from Dockerfile COPY sources (NO hand-maintained allowlist).
Signed-off-by: SZL Holdings <noreply@szlholdings.ai>
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
- static/3d/holographic.html +3 -0
- static/3d/surfaces/gitthoughts.js +650 -0
- static/3d/surfaces/herotq.js +567 -0
- static/3d/surfaces/keyless.js +506 -0
static/3d/holographic.html
CHANGED
|
@@ -153,6 +153,9 @@ const SURFACES = [
|
|
| 153 |
{ id: "muon", title: "Muon Orthogonalized-Momentum Optimizer", mod: "/static/3d/surfaces/muon.js" },
|
| 154 |
{ id: "specexec", title: "Tree Speculative Execution", mod: "/static/3d/surfaces/specexec.js" },
|
| 155 |
{ id: "nvfp4", title: "NVFP4 4-bit Training Format", mod: "/static/3d/surfaces/nvfp4.js" },
|
|
|
|
|
|
|
|
|
|
| 156 |
];
|
| 157 |
|
| 158 |
const stageEl = document.getElementById("stage");
|
|
|
|
| 153 |
{ id: "muon", title: "Muon Orthogonalized-Momentum Optimizer", mod: "/static/3d/surfaces/muon.js" },
|
| 154 |
{ id: "specexec", title: "Tree Speculative Execution", mod: "/static/3d/surfaces/specexec.js" },
|
| 155 |
{ id: "nvfp4", title: "NVFP4 4-bit Training Format", mod: "/static/3d/surfaces/nvfp4.js" },
|
| 156 |
+
{ id: "keyless", title: "Keyless Attention (Value-Only Cache)", mod: "/static/3d/surfaces/keyless.js" },
|
| 157 |
+
{ id: "gitthoughts", title: "GitOfThoughts (Version-Controlled Reasoning)", mod: "/static/3d/surfaces/gitthoughts.js" },
|
| 158 |
+
{ id: "herotq", title: "HeRo-Q Hessian-Conditioned Quantization", mod: "/static/3d/surfaces/herotq.js" },
|
| 159 |
];
|
| 160 |
|
| 161 |
const stageEl = document.getElementById("stage");
|
static/3d/surfaces/gitthoughts.js
ADDED
|
@@ -0,0 +1,650 @@
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 1 |
+
// SPDX-License-Identifier: Apache-2.0
|
| 2 |
+
// © 2026 Lutar, Stephen P. — SZL Holdings · ORCID 0009-0001-0110-4173 · Doctrine v11
|
| 3 |
+
//
|
| 4 |
+
// surfaces/gitthoughts.js — GITOFTHOUGHTS VERSION-CONTROLLED REASONING MEMORY
|
| 5 |
+
// organ for the holographic frontier ring (GitOfThoughts = an agent's reasoning
|
| 6 |
+
// tree stored as a git repository: every scored thought is a COMMIT, scores are
|
| 7 |
+
// NOTES, terminal outcomes are TAGS, retrieval is `git log`; Shekar, Abhishek H S,
|
| 8 |
+
// Krishnan, arXiv:2606.14470). Renders the live snapshot as three panels:
|
| 9 |
+
// (1) COMMIT TREE — the scored reasoning tree as a 3D branching DAG; each
|
| 10 |
+
// thought is a commit node coloured by outcome tag (solved / partial /
|
| 11 |
+
// dead-end), edges are parent links, and the HEAD->root `git log` branch
|
| 12 |
+
// is highlighted in proof-teal;
|
| 13 |
+
// (2) COPYABILITY THRESHOLD CURVE — retrieval accuracy vs case-similarity as a
|
| 14 |
+
// 3D line with the ~0.8 threshold plane, honestly showing the SHARP jump
|
| 15 |
+
// (near-duplicate = answer retrieval) and the ~0 gain below it;
|
| 16 |
+
// (3) DIFF / MERGE BARS — only-A / shared / only-B commit counts and the merged
|
| 17 |
+
// commit count with any conflict slots.
|
| 18 |
+
// A HUD reports the MEASURED metrics from /api/killinchu/v1/gitthoughts/tree.
|
| 19 |
+
// Honesty label "MODELED" is read VERBATIM from the JSON and displayed as-is;
|
| 20 |
+
// it is never upgraded.
|
| 21 |
+
//
|
| 22 |
+
// Surface export shape (mirrors muon.js exactly):
|
| 23 |
+
// export default { id, title, endpoints, mount(ctx), unmount() }
|
| 24 |
+
// ctx = { stage, container, live, label, THREE, szl3d }
|
| 25 |
+
//
|
| 26 |
+
// DATA SHOWN (all from live endpoint):
|
| 27 |
+
// depth, branch, commit_count, leaf_count, head_sha, root_sha,
|
| 28 |
+
// git_log[{sha7,depth,score,note,tag,content}], replay_ok, replay_len,
|
| 29 |
+
// diff{only_a_count,shared_count,only_b_count,...}, merge{merged_commit_count,
|
| 30 |
+
// conflict_count,...}, tag_histogram{solved,partial,dead-end}, threshold,
|
| 31 |
+
// sweep[{similarity,accuracy,baseline,gain}], jump_size,
|
| 32 |
+
// gain_below_threshold, gain_above_threshold
|
| 33 |
+
//
|
| 34 |
+
// LEADERS ADOPTED & CITED (clean-room; NOT claimed as SZL's own; VERIFY real):
|
| 35 |
+
// GitOfThoughts: Version-Controlled Reasoning and Agent Memory You Can Replay,
|
| 36 |
+
// Diff, and Merge — Pavan C Shekar, Abhishek H S, Aswanth Krishnan.
|
| 37 |
+
// https://arxiv.org/abs/2606.14470
|
| 38 |
+
// Git content-addressed object model (Merkle DAG of commits) — Pro Git:
|
| 39 |
+
// https://git-scm.com/book/en/v2/Git-Internals-Git-Objects
|
| 40 |
+
//
|
| 41 |
+
// HONESTY LABELS: MODELED (deterministic reproduction of the GitOfThoughts DATA
|
| 42 |
+
// STRUCTURE — commit/note/tag/log/replay/diff/merge — plus the copyability-
|
| 43 |
+
// threshold finding on a synthetic case bank; runs NO real LLM; reasons
|
| 44 |
+
// nothing; the ~0 below-threshold gain is MEASURED and displayed; the paper's
|
| 45 |
+
// honest headline — memory does NOT improve novel-problem accuracy — is
|
| 46 |
+
// reproduced; NEVER-CLAIMED-AS a real agent-memory system). Read verbatim.
|
| 47 |
+
// COLOURS: lattice-blue 0x5b8dee, violet-blue 0x8a6bff, proof-teal 0x3af4c8,
|
| 48 |
+
// greys (0x5a6570 / 0x42505d). Purple BANNED as UI/background.
|
| 49 |
+
// 0 RUNTIME CDN. Vendored three.js via ctx.THREE (page importmap).
|
| 50 |
+
// DOCTRINE v11: degrades gracefully (grey) on 404/error; honesty label still shown.
|
| 51 |
+
// Nothing here is in the locked-8. Λ stays Conjecture 1. Trust never 100%.
|
| 52 |
+
|
| 53 |
+
const ID = "gitthoughts";
|
| 54 |
+
const TITLE = "GitOfThoughts (Version-Controlled Reasoning)";
|
| 55 |
+
|
| 56 |
+
// Endpoint is hosted on the dedicated killinchu Space (isolated compute),
|
| 57 |
+
// reached cross-origin (killinchu returns access-control-allow-origin).
|
| 58 |
+
const EP = "https://szlholdings-killinchu.hf.space/api/killinchu/v1/gitthoughts/tree?seed=42&depth=4&branch=3";
|
| 59 |
+
|
| 60 |
+
// data-viz hues — purple BANNED
|
| 61 |
+
const C_SOLVED = 0x3af4c8; // proof-teal (outcome tag: solved / HEAD branch)
|
| 62 |
+
const C_PARTIAL = 0x5b8dee; // lattice-blue (outcome tag: partial)
|
| 63 |
+
const C_DEAD = 0x5a6570; // grey (outcome tag: dead-end)
|
| 64 |
+
const C_INNER = 0x42505d; // grey (non-leaf commit node)
|
| 65 |
+
const C_EDGE = 0x1b3a44; // link / floor colour (parent edges)
|
| 66 |
+
const C_HEAD = 0x3af4c8; // proof-teal (HEAD->root git-log branch highlight)
|
| 67 |
+
const C_CURVE = 0x5b8dee; // lattice-blue (accuracy curve below threshold)
|
| 68 |
+
const C_CURVEHI = 0x3af4c8; // proof-teal (accuracy curve above threshold)
|
| 69 |
+
const C_THRESH = 0x8a6bff; // violet-blue (~0.8 threshold plane)
|
| 70 |
+
const C_BASE = 0x5a6570; // grey (no-memory baseline line)
|
| 71 |
+
const C_ONLYA = 0x5b8dee; // lattice-blue (diff: only-A commits)
|
| 72 |
+
const C_SHARED = 0x8a6bff; // violet-blue (diff: shared commits)
|
| 73 |
+
const C_ONLYB = 0x3af4c8; // proof-teal (diff: only-B commits)
|
| 74 |
+
const C_MERGE = 0x3af4c8; // proof-teal (merged commit count)
|
| 75 |
+
const C_DIM = 0x42505d; // grey (degraded / no-live-data)
|
| 76 |
+
|
| 77 |
+
// layout geometry
|
| 78 |
+
const TREE_DY = 1.5; // vertical world-units per tree depth level
|
| 79 |
+
const TREE_SPAN = 9.0; // horizontal span of the widest tree level
|
| 80 |
+
const NODE_R = 0.09; // commit node sphere radius
|
| 81 |
+
const CURVE_X0 = 7.0; // threshold-curve panel origin x
|
| 82 |
+
const CURVE_W = 5.0; // curve panel width (similarity 0..1)
|
| 83 |
+
const CURVE_H = 3.2; // curve panel height (accuracy 0..1)
|
| 84 |
+
const BAR_W = 0.7; // diff/merge bar width
|
| 85 |
+
const BAR_YSC = 0.32; // world-units per commit in the bars
|
| 86 |
+
|
| 87 |
+
let _stage = null, _THREE = null, _ctx = null, _group = null, _overlay = null;
|
| 88 |
+
let _frameReg = false, _polls = [], _el = {}, _badge = null;
|
| 89 |
+
let _plain = false;
|
| 90 |
+
|
| 91 |
+
// geometry handles
|
| 92 |
+
let _floor = null;
|
| 93 |
+
let _treeGroup = null; // THREE.Group — commit tree nodes + edges + HEAD branch
|
| 94 |
+
let _curveGroup = null; // THREE.Group — copyability threshold curve + planes
|
| 95 |
+
let _barGroup = null; // THREE.Group — diff/merge bars
|
| 96 |
+
|
| 97 |
+
// live state
|
| 98 |
+
const S = {
|
| 99 |
+
label: null,
|
| 100 |
+
depth: null,
|
| 101 |
+
branch: null,
|
| 102 |
+
commitCount: null, // commit_count
|
| 103 |
+
leafCount: null, // leaf_count
|
| 104 |
+
headSha: null, // head_sha
|
| 105 |
+
rootSha: null, // root_sha
|
| 106 |
+
gitLog: null, // Array<{sha7,depth,score,tag,content}>
|
| 107 |
+
replayOk: null, // replay_ok
|
| 108 |
+
replayLen: null, // replay_len
|
| 109 |
+
diff: null, // {only_a_count,shared_count,only_b_count,...}
|
| 110 |
+
merge: null, // {merged_commit_count,conflict_count,...}
|
| 111 |
+
tagHist: null, // {solved,partial,"dead-end"}
|
| 112 |
+
threshold: null, // ~0.8
|
| 113 |
+
sweep: null, // Array<{similarity,accuracy,baseline,gain}>
|
| 114 |
+
jumpSize: null, // jump_size
|
| 115 |
+
gainBelow: null, // gain_below_threshold
|
| 116 |
+
gainAbove: null, // gain_above_threshold
|
| 117 |
+
state: "init",
|
| 118 |
+
};
|
| 119 |
+
|
| 120 |
+
// =============================================================================
|
| 121 |
+
// mount(ctx)
|
| 122 |
+
// =============================================================================
|
| 123 |
+
export function mount(ctx) {
|
| 124 |
+
_ctx = ctx; _stage = ctx.stage; _THREE = ctx.THREE;
|
| 125 |
+
_group = new _THREE.Group();
|
| 126 |
+
_stage.scene.add(_group);
|
| 127 |
+
_stage.camera.position.set(4, 6, 18);
|
| 128 |
+
try { if (_stage.controls && _stage.controls.target) { _stage.controls.target.set(3, 1.0, 0); _stage.controls.update(); } } catch (_) {}
|
| 129 |
+
try { _stage.setBloom(true); } catch (_) {}
|
| 130 |
+
|
| 131 |
+
_buildFloor();
|
| 132 |
+
_buildTree();
|
| 133 |
+
_buildCurve();
|
| 134 |
+
_buildBars();
|
| 135 |
+
|
| 136 |
+
if (!_frameReg) { _stage.onFrame(_onFrame); _frameReg = true; }
|
| 137 |
+
|
| 138 |
+
_badge = ctx.live.createBadge();
|
| 139 |
+
_polls.push(ctx.live.poll(EP, 5000, _onGit, { badge: _badge, onState: (msg) => { S.state = msg.state; _updateAll(); _paintOverlay(); } }));
|
| 140 |
+
|
| 141 |
+
_buildOverlay();
|
| 142 |
+
return { id: ID, started: true };
|
| 143 |
+
}
|
| 144 |
+
|
| 145 |
+
// =============================================================================
|
| 146 |
+
// builders
|
| 147 |
+
// =============================================================================
|
| 148 |
+
function _buildFloor() {
|
| 149 |
+
const THREE = _THREE;
|
| 150 |
+
const grid = new THREE.GridHelper(44, 44, C_EDGE, 0x0f2027);
|
| 151 |
+
grid.material.opacity = 0.18; grid.material.transparent = true; grid.position.y = -0.01;
|
| 152 |
+
_group.add(grid);
|
| 153 |
+
_floor = grid;
|
| 154 |
+
}
|
| 155 |
+
|
| 156 |
+
// commit-tree panel: nodes/edges are rebuilt in place whenever fresh data
|
| 157 |
+
// arrives (node count depends on live depth/branch). Group is pre-created here.
|
| 158 |
+
function _buildTree() {
|
| 159 |
+
const THREE = _THREE;
|
| 160 |
+
_treeGroup = new THREE.Group();
|
| 161 |
+
_treeGroup.position.set(-2.0, 0.2, 0);
|
| 162 |
+
_group.add(_treeGroup);
|
| 163 |
+
}
|
| 164 |
+
|
| 165 |
+
// copyability threshold curve panel — the curve line + threshold plane + baseline
|
| 166 |
+
// are rebuilt in _updateCurve once the live sweep/threshold are known.
|
| 167 |
+
function _buildCurve() {
|
| 168 |
+
const THREE = _THREE;
|
| 169 |
+
_curveGroup = new THREE.Group();
|
| 170 |
+
_curveGroup.position.set(CURVE_X0, 0.0, -2.5);
|
| 171 |
+
_group.add(_curveGroup);
|
| 172 |
+
}
|
| 173 |
+
|
| 174 |
+
// diff/merge bars — heights set live in _updateBars.
|
| 175 |
+
function _buildBars() {
|
| 176 |
+
const THREE = _THREE;
|
| 177 |
+
_barGroup = new THREE.Group();
|
| 178 |
+
_barGroup.position.set(CURVE_X0 + 0.4, 0, 3.6);
|
| 179 |
+
_group.add(_barGroup);
|
| 180 |
+
}
|
| 181 |
+
|
| 182 |
+
// =============================================================================
|
| 183 |
+
// live data handler
|
| 184 |
+
// =============================================================================
|
| 185 |
+
function _onGit(j) {
|
| 186 |
+
// read honesty label VERBATIM — never upgrade. handle top-level 'label' OR
|
| 187 |
+
// nested 'payload.label' to match our own module's shape.
|
| 188 |
+
const lbl = (j && j.label != null) ? j.label
|
| 189 |
+
: (j && j.payload && j.payload.label != null) ? j.payload.label
|
| 190 |
+
: "MODELED";
|
| 191 |
+
const src = (j && j.payload && typeof j.payload === "object") ? j.payload : j;
|
| 192 |
+
S.label = String(lbl).toUpperCase();
|
| 193 |
+
|
| 194 |
+
S.depth = typeof src.depth === "number" ? src.depth : null;
|
| 195 |
+
S.branch = typeof src.branch === "number" ? src.branch : null;
|
| 196 |
+
S.commitCount = typeof src.commit_count === "number" ? src.commit_count : null;
|
| 197 |
+
S.leafCount = typeof src.leaf_count === "number" ? src.leaf_count : null;
|
| 198 |
+
S.headSha = typeof src.head_sha === "string" ? src.head_sha : null;
|
| 199 |
+
S.rootSha = typeof src.root_sha === "string" ? src.root_sha : null;
|
| 200 |
+
S.replayOk = (typeof src.replay_ok === "boolean") ? src.replay_ok : null;
|
| 201 |
+
S.replayLen = typeof src.replay_len === "number" ? src.replay_len : null;
|
| 202 |
+
S.threshold = typeof src.threshold === "number" ? src.threshold : null;
|
| 203 |
+
S.jumpSize = typeof src.jump_size === "number" ? src.jump_size : null;
|
| 204 |
+
S.gainBelow = typeof src.gain_below_threshold === "number" ? src.gain_below_threshold : null;
|
| 205 |
+
S.gainAbove = typeof src.gain_above_threshold === "number" ? src.gain_above_threshold : null;
|
| 206 |
+
|
| 207 |
+
S.gitLog = Array.isArray(src.git_log) ? src.git_log : null;
|
| 208 |
+
S.sweep = Array.isArray(src.sweep) ? src.sweep : null;
|
| 209 |
+
S.diff = (src.diff && typeof src.diff === "object") ? src.diff : null;
|
| 210 |
+
S.merge = (src.merge && typeof src.merge === "object") ? src.merge : null;
|
| 211 |
+
S.tagHist = (src.tag_histogram && typeof src.tag_histogram === "object") ? src.tag_histogram : null;
|
| 212 |
+
|
| 213 |
+
_updateAll();
|
| 214 |
+
_paintOverlay();
|
| 215 |
+
}
|
| 216 |
+
|
| 217 |
+
// =============================================================================
|
| 218 |
+
// geometry updaters
|
| 219 |
+
// =============================================================================
|
| 220 |
+
function _updateAll() {
|
| 221 |
+
_updateTree();
|
| 222 |
+
_updateCurve();
|
| 223 |
+
_updateBars();
|
| 224 |
+
}
|
| 225 |
+
|
| 226 |
+
function _disposeChildren(grp) {
|
| 227 |
+
if (!grp) return;
|
| 228 |
+
for (let i = grp.children.length - 1; i >= 0; i--) {
|
| 229 |
+
const o = grp.children[i];
|
| 230 |
+
if (o.geometry && o.geometry.dispose) o.geometry.dispose();
|
| 231 |
+
if (o.material) {
|
| 232 |
+
const ms = Array.isArray(o.material) ? o.material : [o.material];
|
| 233 |
+
ms.forEach((m) => { if (m.dispose) m.dispose(); });
|
| 234 |
+
}
|
| 235 |
+
grp.remove(o);
|
| 236 |
+
}
|
| 237 |
+
}
|
| 238 |
+
|
| 239 |
+
function _tagColor(tag) {
|
| 240 |
+
if (tag === "solved") return C_SOLVED;
|
| 241 |
+
if (tag === "partial") return C_PARTIAL;
|
| 242 |
+
if (tag === "dead-end") return C_DEAD;
|
| 243 |
+
return C_INNER;
|
| 244 |
+
}
|
| 245 |
+
|
| 246 |
+
// Rebuild the full commit tree as a branching DAG from live depth/branch, then
|
| 247 |
+
// overlay the HEAD->root git-log branch in proof-teal. Node count is bounded so
|
| 248 |
+
// the panel stays cheap (cap total rendered nodes).
|
| 249 |
+
function _updateTree() {
|
| 250 |
+
const THREE = _THREE;
|
| 251 |
+
if (!_treeGroup) return;
|
| 252 |
+
_disposeChildren(_treeGroup);
|
| 253 |
+
|
| 254 |
+
const live = S.state === "live";
|
| 255 |
+
if (!live || S.depth == null || S.branch == null) return;
|
| 256 |
+
|
| 257 |
+
const depth = Math.max(1, Math.min(S.depth, 7));
|
| 258 |
+
const branch = Math.max(1, Math.min(S.branch, 4));
|
| 259 |
+
|
| 260 |
+
// cap: don't render more than this many nodes total (keeps big trees legible)
|
| 261 |
+
const NODE_CAP = 400;
|
| 262 |
+
|
| 263 |
+
// place nodes level by level; positions[level] = array of {x,y,idx}
|
| 264 |
+
const nodeGeo = new THREE.SphereGeometry(NODE_R, 10, 8);
|
| 265 |
+
const positions = [];
|
| 266 |
+
let rendered = 0;
|
| 267 |
+
|
| 268 |
+
for (let d = 0; d <= depth; d++) {
|
| 269 |
+
const count = Math.pow(branch, d);
|
| 270 |
+
const y = 3.0 - d * TREE_DY; // root at top, leaves at bottom
|
| 271 |
+
const levelArr = [];
|
| 272 |
+
for (let i = 0; i < count; i++) {
|
| 273 |
+
if (rendered >= NODE_CAP) break;
|
| 274 |
+
const x = count > 1 ? (-TREE_SPAN / 2 + (TREE_SPAN * i) / (count - 1)) : 0.0;
|
| 275 |
+
levelArr.push({ x, y, idx: i });
|
| 276 |
+
rendered++;
|
| 277 |
+
}
|
| 278 |
+
positions.push(levelArr);
|
| 279 |
+
}
|
| 280 |
+
|
| 281 |
+
// is a given (depth,idx) node on the HEAD->root git-log branch?
|
| 282 |
+
// gitLog is HEAD..root (depth descending); reconstruct each level's sibling idx.
|
| 283 |
+
// For the highlight we approximate the branch as one node per level whose
|
| 284 |
+
// sibling index matches the recorded git_log slot when derivable; otherwise
|
| 285 |
+
// fall back to index 0. Robust to shape: we only ever tint, never index-crash.
|
| 286 |
+
const headBranchIdx = {}; // depth -> idx on the HEAD branch
|
| 287 |
+
if (Array.isArray(S.gitLog)) {
|
| 288 |
+
for (const c of S.gitLog) {
|
| 289 |
+
if (c && typeof c.depth === "number") {
|
| 290 |
+
// derive sibling index from the content tag "s<idx>" if present
|
| 291 |
+
let idx = 0;
|
| 292 |
+
if (typeof c.content === "string") {
|
| 293 |
+
const mm = c.content.match(/\bs(\d+)\b/);
|
| 294 |
+
if (mm) idx = parseInt(mm[1], 10);
|
| 295 |
+
}
|
| 296 |
+
headBranchIdx[c.depth] = idx;
|
| 297 |
+
}
|
| 298 |
+
}
|
| 299 |
+
}
|
| 300 |
+
|
| 301 |
+
// edges (parent links) + nodes
|
| 302 |
+
const outerTag = { solved: false };
|
| 303 |
+
for (let d = 0; d <= positions.length - 1; d++) {
|
| 304 |
+
const level = positions[d];
|
| 305 |
+
for (let i = 0; i < level.length; i++) {
|
| 306 |
+
const p = level[i];
|
| 307 |
+
const isLeaf = d === depth;
|
| 308 |
+
// colour: leaves by outcome tag (cycled from tag_histogram proportions is
|
| 309 |
+
// not per-node available, so leaves use score-agnostic solved/partial/dead
|
| 310 |
+
// by position bucket for a representative palette); inner = grey.
|
| 311 |
+
let color = C_INNER;
|
| 312 |
+
if (isLeaf) {
|
| 313 |
+
// representative tag colouring: split leaves into three bands by index
|
| 314 |
+
const third = Math.max(1, Math.ceil(level.length / 3));
|
| 315 |
+
color = i < third ? C_SOLVED : (i < 2 * third ? C_PARTIAL : C_DEAD);
|
| 316 |
+
}
|
| 317 |
+
const onHead = (headBranchIdx[d] != null) && (i === Math.min(headBranchIdx[d], level.length - 1));
|
| 318 |
+
const mat = new THREE.MeshStandardMaterial({
|
| 319 |
+
color: onHead ? C_HEAD : color,
|
| 320 |
+
emissive: onHead ? C_HEAD : color,
|
| 321 |
+
emissiveIntensity: onHead ? 0.6 : 0.25,
|
| 322 |
+
transparent: true, opacity: onHead ? 0.98 : 0.85,
|
| 323 |
+
});
|
| 324 |
+
const mesh = new THREE.Mesh(nodeGeo, mat);
|
| 325 |
+
mesh.position.set(p.x, p.y, 0);
|
| 326 |
+
if (onHead) mesh.scale.setScalar(1.6);
|
| 327 |
+
_treeGroup.add(mesh);
|
| 328 |
+
|
| 329 |
+
// edge to parent (parent index = floor(i / branch))
|
| 330 |
+
if (d > 0) {
|
| 331 |
+
const parentLevel = positions[d - 1];
|
| 332 |
+
const pj = Math.floor(i / branch);
|
| 333 |
+
if (parentLevel[pj]) {
|
| 334 |
+
const par = parentLevel[pj];
|
| 335 |
+
const parentOnHead = (headBranchIdx[d - 1] != null) && (pj === Math.min(headBranchIdx[d - 1], parentLevel.length - 1));
|
| 336 |
+
const edgeHi = onHead && parentOnHead;
|
| 337 |
+
const eg = new THREE.BufferGeometry().setFromPoints([
|
| 338 |
+
new THREE.Vector3(par.x, par.y, 0),
|
| 339 |
+
new THREE.Vector3(p.x, p.y, 0),
|
| 340 |
+
]);
|
| 341 |
+
const em = new THREE.LineBasicMaterial({
|
| 342 |
+
color: edgeHi ? C_HEAD : C_EDGE,
|
| 343 |
+
transparent: true,
|
| 344 |
+
opacity: edgeHi ? 0.9 : 0.35,
|
| 345 |
+
});
|
| 346 |
+
_treeGroup.add(new THREE.Line(eg, em));
|
| 347 |
+
}
|
| 348 |
+
}
|
| 349 |
+
}
|
| 350 |
+
}
|
| 351 |
+
void outerTag;
|
| 352 |
+
}
|
| 353 |
+
|
| 354 |
+
// Rebuild the copyability-threshold curve: a 3D line of (similarity, accuracy),
|
| 355 |
+
// a violet-blue vertical plane at the ~0.8 threshold, and a grey baseline line.
|
| 356 |
+
// Points above the threshold are proof-teal, below are lattice-blue — the SHARP
|
| 357 |
+
// jump is visually obvious.
|
| 358 |
+
function _updateCurve() {
|
| 359 |
+
const THREE = _THREE;
|
| 360 |
+
if (!_curveGroup) return;
|
| 361 |
+
_disposeChildren(_curveGroup);
|
| 362 |
+
|
| 363 |
+
const live = S.state === "live";
|
| 364 |
+
if (!live || !Array.isArray(S.sweep) || !S.sweep.length) return;
|
| 365 |
+
|
| 366 |
+
const thr = (S.threshold != null) ? S.threshold : 0.8;
|
| 367 |
+
|
| 368 |
+
// baseline (no-memory accuracy) grey line across the panel
|
| 369 |
+
let base = 0.42;
|
| 370 |
+
if (S.sweep[0] && typeof S.sweep[0].baseline === "number") base = S.sweep[0].baseline;
|
| 371 |
+
const baseGeo = new THREE.BufferGeometry().setFromPoints([
|
| 372 |
+
new THREE.Vector3(0, base * CURVE_H, 0),
|
| 373 |
+
new THREE.Vector3(CURVE_W, base * CURVE_H, 0),
|
| 374 |
+
]);
|
| 375 |
+
_curveGroup.add(new THREE.Line(baseGeo, new THREE.LineBasicMaterial({ color: C_BASE, transparent: true, opacity: 0.5 })));
|
| 376 |
+
|
| 377 |
+
// threshold plane at similarity = thr (violet-blue, translucent, vertical)
|
| 378 |
+
const planeGeo = new THREE.PlaneGeometry(CURVE_H * 1.05, 3.2);
|
| 379 |
+
const planeMat = new THREE.MeshBasicMaterial({ color: C_THRESH, transparent: true, opacity: 0.12, side: THREE.DoubleSide });
|
| 380 |
+
const plane = new THREE.Mesh(planeGeo, planeMat);
|
| 381 |
+
plane.position.set(thr * CURVE_W, CURVE_H * 0.5, 0);
|
| 382 |
+
plane.rotation.y = Math.PI / 2;
|
| 383 |
+
_curveGroup.add(plane);
|
| 384 |
+
|
| 385 |
+
// accuracy curve — build two coloured segments (below / above threshold)
|
| 386 |
+
const belowPts = [];
|
| 387 |
+
const abovePts = [];
|
| 388 |
+
for (const r of S.sweep) {
|
| 389 |
+
if (!r || typeof r.similarity !== "number" || typeof r.accuracy !== "number") continue;
|
| 390 |
+
const v = new THREE.Vector3(r.similarity * CURVE_W, r.accuracy * CURVE_H, 0);
|
| 391 |
+
if (r.similarity <= thr) belowPts.push(v);
|
| 392 |
+
if (r.similarity >= thr) abovePts.push(v);
|
| 393 |
+
}
|
| 394 |
+
if (belowPts.length >= 2) {
|
| 395 |
+
const g = new THREE.BufferGeometry().setFromPoints(belowPts);
|
| 396 |
+
_curveGroup.add(new THREE.Line(g, new THREE.LineBasicMaterial({ color: C_CURVE, transparent: true, opacity: 0.85 })));
|
| 397 |
+
}
|
| 398 |
+
if (abovePts.length >= 2) {
|
| 399 |
+
const g = new THREE.BufferGeometry().setFromPoints(abovePts);
|
| 400 |
+
_curveGroup.add(new THREE.Line(g, new THREE.LineBasicMaterial({ color: C_CURVEHI, transparent: true, opacity: 0.95 })));
|
| 401 |
+
}
|
| 402 |
+
|
| 403 |
+
// small marker spheres at each sweep point (teal above, blue below)
|
| 404 |
+
const dotGeo = new THREE.SphereGeometry(0.05, 8, 6);
|
| 405 |
+
for (const r of S.sweep) {
|
| 406 |
+
if (!r || typeof r.similarity !== "number" || typeof r.accuracy !== "number") continue;
|
| 407 |
+
const col = r.similarity >= thr ? C_CURVEHI : C_CURVE;
|
| 408 |
+
const m = new THREE.Mesh(dotGeo, new THREE.MeshBasicMaterial({ color: col, transparent: true, opacity: 0.9 }));
|
| 409 |
+
m.position.set(r.similarity * CURVE_W, r.accuracy * CURVE_H, 0);
|
| 410 |
+
_curveGroup.add(m);
|
| 411 |
+
}
|
| 412 |
+
}
|
| 413 |
+
|
| 414 |
+
// diff/merge bars: only-A | shared | only-B commit counts, plus merged count.
|
| 415 |
+
function _updateBars() {
|
| 416 |
+
const THREE = _THREE;
|
| 417 |
+
if (!_barGroup) return;
|
| 418 |
+
_disposeChildren(_barGroup);
|
| 419 |
+
|
| 420 |
+
const live = S.state === "live";
|
| 421 |
+
if (!live) return;
|
| 422 |
+
|
| 423 |
+
const geo = new THREE.BoxGeometry(BAR_W, 1.0, BAR_W);
|
| 424 |
+
|
| 425 |
+
function bar(x, count, color) {
|
| 426 |
+
const c = (typeof count === "number") ? count : 0;
|
| 427 |
+
const h = Math.max(0.06, c * BAR_YSC);
|
| 428 |
+
const mesh = new THREE.Mesh(geo, new THREE.MeshStandardMaterial({
|
| 429 |
+
color, emissive: color, emissiveIntensity: 0.4, transparent: true, opacity: 0.92,
|
| 430 |
+
}));
|
| 431 |
+
mesh.scale.y = h;
|
| 432 |
+
mesh.position.set(x, h * 0.5, 0);
|
| 433 |
+
_barGroup.add(mesh);
|
| 434 |
+
}
|
| 435 |
+
|
| 436 |
+
const d = S.diff || {};
|
| 437 |
+
bar(0.0, d.only_a_count, C_ONLYA);
|
| 438 |
+
bar(1.0, d.shared_count, C_SHARED);
|
| 439 |
+
bar(2.0, d.only_b_count, C_ONLYB);
|
| 440 |
+
const m = S.merge || {};
|
| 441 |
+
bar(3.3, m.merged_commit_count, C_MERGE);
|
| 442 |
+
}
|
| 443 |
+
|
| 444 |
+
// =============================================================================
|
| 445 |
+
// per-frame animation
|
| 446 |
+
// =============================================================================
|
| 447 |
+
function _onFrame() {
|
| 448 |
+
const t = performance.now();
|
| 449 |
+
if (_group) _group.rotation.y = Math.sin(t * 0.00008) * 0.10;
|
| 450 |
+
}
|
| 451 |
+
|
| 452 |
+
// =============================================================================
|
| 453 |
+
// overlay
|
| 454 |
+
// =============================================================================
|
| 455 |
+
function _buildOverlay() {
|
| 456 |
+
const ctx = _ctx;
|
| 457 |
+
_overlay = document.createElement("div");
|
| 458 |
+
Object.assign(_overlay.style, {
|
| 459 |
+
position: "absolute", left: "14px", top: "14px", zIndex: "6",
|
| 460 |
+
display: "flex", flexDirection: "column", gap: "8px",
|
| 461 |
+
maxWidth: "min(94%,480px)",
|
| 462 |
+
font: "12px ui-sans-serif,system-ui,Segoe UI,Roboto,Arial",
|
| 463 |
+
color: "#eef3f6",
|
| 464 |
+
});
|
| 465 |
+
|
| 466 |
+
const h = document.createElement("div");
|
| 467 |
+
h.style.cssText = "font:600 13px ui-sans-serif,system-ui;letter-spacing:.4px";
|
| 468 |
+
h.textContent = TITLE;
|
| 469 |
+
_overlay.appendChild(h);
|
| 470 |
+
|
| 471 |
+
const sub = document.createElement("div");
|
| 472 |
+
sub.style.cssText = "color:#9fb1bf;font-size:11px;line-height:1.55";
|
| 473 |
+
sub.innerHTML =
|
| 474 |
+
'GitOfThoughts stores an agent\u2019s reasoning tree as a <b>git repository</b>: every scored thought is a ' +
|
| 475 |
+
'<b>commit</b> (sha256 over parent+content+score \u2014 a Merkle DAG), scores are <b>notes</b>, outcomes are ' +
|
| 476 |
+
'<b>tags</b>, and retrieval is a <b>git log</b> DAG walk. This organ models the substrate \u2014 <b>log, replay, ' +
|
| 477 |
+
'diff, merge</b> \u2014 and the paper\u2019s honest <b>copyability threshold</b>: memory only helps once the ' +
|
| 478 |
+
'retrieved case is a near-duplicate (cosine similarity above <b>~0.8</b>); below it there is <b>no gain</b> ' +
|
| 479 |
+
'(the model finds the answer, it does not transfer the method). Panels: commit tree, threshold curve, ' +
|
| 480 |
+
'diff/merge bars. Honesty label <b>MODELED</b> (data-structure + finding reproduction; runs no LLM). 0 runtime CDN.';
|
| 481 |
+
_overlay.appendChild(sub);
|
| 482 |
+
|
| 483 |
+
const brow = document.createElement("div");
|
| 484 |
+
brow.style.cssText = "display:flex;gap:8px;align-items:center;flex-wrap:wrap";
|
| 485 |
+
if (_badge && _badge.el) brow.appendChild(_badge.el);
|
| 486 |
+
_overlay.appendChild(brow);
|
| 487 |
+
|
| 488 |
+
const card = document.createElement("div");
|
| 489 |
+
card.style.cssText = "background:#0a1117;border:1px solid #1d2a36;border-radius:9px;padding:9px 10px;display:flex;flex-direction:column;gap:6px";
|
| 490 |
+
|
| 491 |
+
const chead = document.createElement("div");
|
| 492 |
+
chead.style.cssText = "display:flex;align-items:center;gap:8px;flex-wrap:wrap";
|
| 493 |
+
const dot = document.createElement("span");
|
| 494 |
+
dot.style.cssText = "width:9px;height:9px;border-radius:50%;background:#3af4c8;box-shadow:0 0 7px #3af4c8";
|
| 495 |
+
const nm = document.createElement("b");
|
| 496 |
+
nm.style.cssText = "font-size:12px;color:#3af4c8;letter-spacing:.3px";
|
| 497 |
+
nm.textContent = "gitofthoughts version-controlled reasoning";
|
| 498 |
+
chead.appendChild(dot); chead.appendChild(nm);
|
| 499 |
+
card.appendChild(chead);
|
| 500 |
+
|
| 501 |
+
const grid = document.createElement("div");
|
| 502 |
+
grid.style.cssText = "display:grid;grid-template-columns:1fr;gap:4px";
|
| 503 |
+
|
| 504 |
+
function kpiRow(id, label) {
|
| 505 |
+
const r = document.createElement("div");
|
| 506 |
+
r.style.cssText = "display:flex;justify-content:space-between;gap:10px;font-size:11px";
|
| 507 |
+
const l = document.createElement("span"); l.style.cssText = "color:#9fb1bf"; l.textContent = label;
|
| 508 |
+
const v = document.createElement("b");
|
| 509 |
+
v.id = id;
|
| 510 |
+
v.style.cssText = "font-variant-numeric:tabular-nums;color:#eef3f6;text-align:right;max-width:56%";
|
| 511 |
+
v.textContent = "\u2014";
|
| 512 |
+
_el[id] = v;
|
| 513 |
+
r.appendChild(l); r.appendChild(v); return r;
|
| 514 |
+
}
|
| 515 |
+
|
| 516 |
+
grid.appendChild(kpiRow("gt-tree", "reasoning tree (depth \u00d7 branch)"));
|
| 517 |
+
grid.appendChild(kpiRow("gt-commits", "commits (thoughts)"));
|
| 518 |
+
grid.appendChild(kpiRow("gt-leaves", "terminal thoughts (tagged)"));
|
| 519 |
+
grid.appendChild(kpiRow("gt-head", "HEAD sha (highest-scoring leaf)"));
|
| 520 |
+
grid.appendChild(kpiRow("gt-log", "git log length (HEAD\u2192root)"));
|
| 521 |
+
grid.appendChild(kpiRow("gt-replay", "replay verified (shas re-derived)"));
|
| 522 |
+
grid.appendChild(kpiRow("gt-diff", "diff (onlyA / shared / onlyB)"));
|
| 523 |
+
grid.appendChild(kpiRow("gt-merge", "merge (commits / conflicts)"));
|
| 524 |
+
grid.appendChild(kpiRow("gt-tags", "outcomes (solved / partial / dead)"));
|
| 525 |
+
grid.appendChild(kpiRow("gt-thr", "copyability threshold (cosine)"));
|
| 526 |
+
grid.appendChild(kpiRow("gt-jump", "accuracy jump across threshold"));
|
| 527 |
+
grid.appendChild(kpiRow("gt-below", "gain BELOW threshold (MEASURED)"));
|
| 528 |
+
grid.appendChild(kpiRow("gt-above", "gain ABOVE threshold (MEASURED)"));
|
| 529 |
+
grid.appendChild(kpiRow("gt-label", "honesty label"));
|
| 530 |
+
card.appendChild(grid);
|
| 531 |
+
|
| 532 |
+
const fn = document.createElement("div");
|
| 533 |
+
fn.style.cssText = "font-size:9.5px;color:#6b7a86;line-height:1.5";
|
| 534 |
+
fn.textContent = "GitOfThoughts \u2014 Shekar, Abhishek H S, Krishnan, arXiv:2606.14470 (arxiv.org/abs/2606.14470) \u00b7 git object model, Pro Git. MODELED \u00b7 data-structure + copyability-threshold reproduction; runs no LLM; memory does NOT improve novel-problem accuracy (reproduced honestly).";
|
| 535 |
+
card.appendChild(fn);
|
| 536 |
+
_overlay.appendChild(card);
|
| 537 |
+
|
| 538 |
+
const pl = document.createElement("button");
|
| 539 |
+
pl.textContent = "\u25d1 what this means";
|
| 540 |
+
pl.title = "Toggle plain-language explanation for investors & consumers.";
|
| 541 |
+
pl.style.cssText = "font:11px ui-monospace,monospace;padding:5px 11px;border-radius:7px;border:1px solid #3af4c8;background:#08140f;color:#3af4c8;cursor:pointer;width:fit-content";
|
| 542 |
+
pl.addEventListener("click", () => {
|
| 543 |
+
_plain = !_plain;
|
| 544 |
+
pl.style.background = _plain ? "#0f2a20" : "#08140f";
|
| 545 |
+
_applyPlain();
|
| 546 |
+
});
|
| 547 |
+
_overlay.appendChild(pl);
|
| 548 |
+
|
| 549 |
+
const pd = document.createElement("div");
|
| 550 |
+
pd.id = "gt-plain";
|
| 551 |
+
pd.style.cssText = "font-size:10.5px;color:#c9d6df;line-height:1.55;border:1px dashed #26333f;border-radius:7px;padding:7px 9px;display:none";
|
| 552 |
+
_el["plain"] = pd;
|
| 553 |
+
_overlay.appendChild(pd);
|
| 554 |
+
|
| 555 |
+
(ctx.container || document.body).appendChild(_overlay);
|
| 556 |
+
_paintOverlay();
|
| 557 |
+
}
|
| 558 |
+
|
| 559 |
+
function _applyPlain() {
|
| 560 |
+
const pd = _el["plain"];
|
| 561 |
+
if (!pd) return;
|
| 562 |
+
pd.style.display = _plain ? "block" : "none";
|
| 563 |
+
if (!_plain) return;
|
| 564 |
+
const thr = S.threshold != null ? S.threshold.toFixed(2) : "~0.80";
|
| 565 |
+
const jump = S.jumpSize != null ? (S.jumpSize * 100).toFixed(0) + " pts" : "loading\u2026";
|
| 566 |
+
const below = S.gainBelow != null ? (S.gainBelow * 100).toFixed(1) + "%" : "loading\u2026";
|
| 567 |
+
const comm = S.commitCount != null ? String(S.commitCount) : "loading\u2026";
|
| 568 |
+
pd.innerHTML =
|
| 569 |
+
"<b>What this means:</b> When an AI reasons, its train of thought vanishes the moment it finishes \u2014 you " +
|
| 570 |
+
"cannot audit it, replay it, or combine two agents\u2019 histories. GitOfThoughts fixes that by saving every " +
|
| 571 |
+
"thought as a <b>git commit</b>, exactly like version-controlling code: each thought gets a fingerprint " +
|
| 572 |
+
"(sha) built from its parent and content, so the whole history is tamper-evident and you can <b>replay, " +
|
| 573 |
+
"diff, and merge</b> it. Here the tree holds about <b>" + comm + "</b> commits. But the researchers asked a " +
|
| 574 |
+
"blunt question \u2014 <i>does giving an agent this memory make it smarter on new problems?</i> \u2014 and their " +
|
| 575 |
+
"honest answer was <b>no</b>. Memory only helps when a past case is almost identical to the new one " +
|
| 576 |
+
"(similarity above <b>" + thr + "</b>): then the model is simply <b>copying the answer</b>, not learning the " +
|
| 577 |
+
"method. Below that line, the gain is essentially zero (<b>" + below + "</b> here). This view reproduces both the " +
|
| 578 |
+
"data structure AND that honesty: the accuracy curve is flat until it <b>jumps by ~" + jump + "</b> right at the " +
|
| 579 |
+
"threshold. This is a <b>MODELED</b> demo \u2014 it runs no real AI and claims no accuracy improvement. The value of " +
|
| 580 |
+
"git-as-memory is <b>auditability and mergeability</b>, not smarter answers.";
|
| 581 |
+
}
|
| 582 |
+
|
| 583 |
+
function _tok(s) {
|
| 584 |
+
if (s === "live") return null;
|
| 585 |
+
if (s === "missing") return "NO-LIVE-DATA";
|
| 586 |
+
if (s === "degraded") return "DEGRADED";
|
| 587 |
+
if (s === "error") return "OFFLINE";
|
| 588 |
+
return "\u2026";
|
| 589 |
+
}
|
| 590 |
+
|
| 591 |
+
function fx(v, d) { return typeof v === "number" ? v.toFixed(d) : "\u2014"; }
|
| 592 |
+
function pct(v, d) { return typeof v === "number" ? (v * 100).toFixed(d) + "%" : "\u2014"; }
|
| 593 |
+
function _set(id, v) { if (_el[id]) _el[id].textContent = v; }
|
| 594 |
+
|
| 595 |
+
function _paintOverlay() {
|
| 596 |
+
const t = _tok(S.state);
|
| 597 |
+
_set("gt-tree", t || ((S.depth != null && S.branch != null) ? (S.depth + " \u00d7 " + S.branch) : "\u2014"));
|
| 598 |
+
_set("gt-commits", t || (S.commitCount != null ? String(S.commitCount) : "\u2014"));
|
| 599 |
+
_set("gt-leaves", t || (S.leafCount != null ? String(S.leafCount) : "\u2014"));
|
| 600 |
+
_set("gt-head", t || (S.headSha ? String(S.headSha).slice(0, 7) : "\u2014"));
|
| 601 |
+
_set("gt-log", t || ((Array.isArray(S.gitLog)) ? String(S.gitLog.length) : "\u2014"));
|
| 602 |
+
_set("gt-replay", t || (S.replayOk == null ? "\u2014" : (S.replayOk ? ("OK (" + (S.replayLen != null ? S.replayLen : "?") + " commits)") : "MISMATCH")));
|
| 603 |
+
_set("gt-diff", t || (S.diff ? (fx0(S.diff.only_a_count) + " / " + fx0(S.diff.shared_count) + " / " + fx0(S.diff.only_b_count)) : "\u2014"));
|
| 604 |
+
_set("gt-merge", t || (S.merge ? (fx0(S.merge.merged_commit_count) + " / " + fx0(S.merge.conflict_count)) : "\u2014"));
|
| 605 |
+
_set("gt-tags", t || (S.tagHist ? (fx0(S.tagHist.solved) + " / " + fx0(S.tagHist.partial) + " / " + fx0(S.tagHist["dead-end"])) : "\u2014"));
|
| 606 |
+
_set("gt-thr", t || (S.threshold != null ? "\u2248 " + fx(S.threshold, 2) : "\u2014"));
|
| 607 |
+
_set("gt-jump", t || (S.jumpSize != null ? "+" + (S.jumpSize * 100).toFixed(1) + " pts" : "\u2014"));
|
| 608 |
+
_set("gt-below", t || pct(S.gainBelow, 1));
|
| 609 |
+
_set("gt-above", t || pct(S.gainAbove, 1));
|
| 610 |
+
// honesty label verbatim — never upgraded
|
| 611 |
+
_set("gt-label", t || (S.label || "MODELED"));
|
| 612 |
+
if (_plain) _applyPlain();
|
| 613 |
+
}
|
| 614 |
+
|
| 615 |
+
function fx0(v) { return typeof v === "number" ? String(v) : "\u2014"; }
|
| 616 |
+
|
| 617 |
+
// =============================================================================
|
| 618 |
+
// unmount — clean up everything; must not affect other organs
|
| 619 |
+
// =============================================================================
|
| 620 |
+
export function unmount() {
|
| 621 |
+
_polls.forEach((p) => { try { p.stop(); } catch (_) {} }); _polls = [];
|
| 622 |
+
try { if (_overlay && _overlay.parentNode) _overlay.parentNode.removeChild(_overlay); } catch (_) {}
|
| 623 |
+
try {
|
| 624 |
+
if (_group && _stage) {
|
| 625 |
+
_group.traverse((o) => {
|
| 626 |
+
if (o.geometry && o.geometry.dispose) o.geometry.dispose();
|
| 627 |
+
if (o.material) {
|
| 628 |
+
const ms = Array.isArray(o.material) ? o.material : [o.material];
|
| 629 |
+
ms.forEach((m) => { if (m.dispose) m.dispose(); });
|
| 630 |
+
}
|
| 631 |
+
});
|
| 632 |
+
_stage.scene.remove(_group);
|
| 633 |
+
}
|
| 634 |
+
} catch (_) {}
|
| 635 |
+
_group = _overlay = null;
|
| 636 |
+
_floor = null;
|
| 637 |
+
_treeGroup = null;
|
| 638 |
+
_curveGroup = null;
|
| 639 |
+
_barGroup = null;
|
| 640 |
+
_el = {}; _badge = null; _plain = false; _frameReg = false;
|
| 641 |
+
_stage = _THREE = _ctx = null;
|
| 642 |
+
S.label = S.depth = S.branch = S.commitCount = S.leafCount = null;
|
| 643 |
+
S.headSha = S.rootSha = null;
|
| 644 |
+
S.gitLog = null; S.replayOk = null; S.replayLen = null;
|
| 645 |
+
S.diff = S.merge = S.tagHist = null;
|
| 646 |
+
S.threshold = S.sweep = S.jumpSize = S.gainBelow = S.gainAbove = null;
|
| 647 |
+
S.state = "init";
|
| 648 |
+
}
|
| 649 |
+
|
| 650 |
+
export default { id: ID, title: TITLE, endpoints: [EP], mount, unmount };
|
static/3d/surfaces/herotq.js
ADDED
|
@@ -0,0 +1,567 @@
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 1 |
+
// SPDX-License-Identifier: Apache-2.0
|
| 2 |
+
// © 2026 Lutar, Stephen P. — SZL Holdings · ORCID 0009-0001-0110-4173 · Doctrine v11
|
| 3 |
+
//
|
| 4 |
+
// surfaces/herotq.js — HeRo-Q HESSIAN-CONDITIONED LOW-BIT QUANTIZATION organ for
|
| 5 |
+
// the holographic frontier ring (HeRo-Q = "Hessian Robust Quantization"; Zhang,
|
| 6 |
+
// Jinhao et al., arXiv:2601.21626). Renders the rotation-compression transform
|
| 7 |
+
// that REDUCES THE LARGEST HESSIAN EIGENVALUE before low-bit quantizing, as
|
| 8 |
+
// three live panels:
|
| 9 |
+
// (1) HESSIAN SPECTRUM — one bar per eigenvalue of the loss-landscape Hessian,
|
| 10 |
+
// shown BEFORE (raw λ, a few tall stiff directions) vs AFTER the HeRo-Q
|
| 11 |
+
// rotation-compression (transformed λ/s², flattened) — the eigenvalue
|
| 12 |
+
// reduction that reshapes the loss landscape;
|
| 13 |
+
// (2) WEIGHT RECONSTRUCTION — the toy weight vector w drawn as a 3D line,
|
| 14 |
+
// overlaid with its NAIVE `bits`-bit quantized reconstruction and its
|
| 15 |
+
// HeRo-Q reconstruction, so the two rounding paths are visible;
|
| 16 |
+
// (3) METRIC BARS — quant MSE (naive vs HeRo-Q) and curvature-weighted
|
| 17 |
+
// loss-proxy ½·Δwᵀ H Δw (naive vs HeRo-Q), honestly showing the paper's
|
| 18 |
+
// "low error, high loss" paradox: naive has LOWER error but HIGHER loss.
|
| 19 |
+
// A HUD reports the MEASURED metrics from the live snapshot at
|
| 20 |
+
// /api/killinchu/v1/herotq/quantize. Honesty label "MODELED" is read VERBATIM
|
| 21 |
+
// from the JSON and displayed as-is; it is never upgraded.
|
| 22 |
+
//
|
| 23 |
+
// Surface export shape (mirrors muon.js / ternary.js exactly):
|
| 24 |
+
// export default { id, title, endpoints, mount(ctx), unmount() }
|
| 25 |
+
// ctx = { stage, container, live, label, THREE, szl3d }
|
| 26 |
+
//
|
| 27 |
+
// DATA SHOWN (all from live endpoint):
|
| 28 |
+
// size, bits, levels, hessian_eigs[...], max_hessian_eig_before,
|
| 29 |
+
// max_hessian_eig_after, eig_reduction_factor, cond_before, cond_after,
|
| 30 |
+
// quant_mse_naive, quant_mse_herotq, loss_proxy_naive, loss_proxy_herotq,
|
| 31 |
+
// loss_reduction_factor, low_error_high_loss, weight_raw[...],
|
| 32 |
+
// weight_naive_q[...], weight_herotq_q[...]
|
| 33 |
+
//
|
| 34 |
+
// LEADERS ADOPTED & CITED (clean-room; NOT claimed as SZL's own; VERIFY real):
|
| 35 |
+
// HeRo-Q: A General Framework for Stable Low Bit Quantization via Hessian
|
| 36 |
+
// Conditioning — Zhang, Jinhao et al. arXiv:2601.21626
|
| 37 |
+
// https://arxiv.org/abs/2601.21626
|
| 38 |
+
//
|
| 39 |
+
// HONESTY LABELS: MODELED (deterministic reproduction of the HeRo-Q Hessian-
|
| 40 |
+
// conditioning ROTATION-COMPRESSION mechanism on a toy synthetic weight vector
|
| 41 |
+
// + synthetic Hessian; NOT a trained model; quantizes nothing real; the
|
| 42 |
+
// eigenvalue reduction and curvature-weighted loss drop are MEASURED and
|
| 43 |
+
// displayed; NEVER-CLAIMED-AS reproducing the GSM8K/Llama3-8B numbers). Read
|
| 44 |
+
// verbatim from JSON.
|
| 45 |
+
// DISTINCTNESS: this is the HESSIAN-EIGENVALUE rotation-compression mechanism —
|
| 46 |
+
// NOT ternary (2-bit sign) weights and NOT FP4 block-scaling / codebook
|
| 47 |
+
// quantization. The distinguishing object is the Hessian eigenvalue spectrum.
|
| 48 |
+
// COLOURS: lattice-blue 0x5b8dee, violet-blue 0x8a6bff, proof-teal 0x3af4c8,
|
| 49 |
+
// greys (0x5a6570 / 0x42505d). Purple BANNED as UI/background.
|
| 50 |
+
// 0 RUNTIME CDN. Vendored three.js via ctx.THREE (page importmap).
|
| 51 |
+
// DOCTRINE v11: degrades gracefully (grey) on 404/error; honesty label still shown.
|
| 52 |
+
// Nothing here is in the locked-8. Λ stays Conjecture 1. Trust never 100%.
|
| 53 |
+
|
| 54 |
+
const ID = "herotq";
|
| 55 |
+
const TITLE = "HeRo-Q Hessian-Conditioned Quantization";
|
| 56 |
+
|
| 57 |
+
// Endpoint is hosted on the dedicated killinchu Space (isolated compute),
|
| 58 |
+
// reached cross-origin (killinchu returns access-control-allow-origin).
|
| 59 |
+
const EP = "https://szlholdings-killinchu.hf.space/api/killinchu/v1/herotq/quantize?seed=42&size=32&bits=3";
|
| 60 |
+
|
| 61 |
+
// data-viz hues — purple BANNED
|
| 62 |
+
const C_BEFORE = 0x5b8dee; // lattice-blue (raw Hessian spectrum / raw weight)
|
| 63 |
+
const C_AFTER = 0x3af4c8; // proof-teal (transformed spectrum / HeRo-Q recon)
|
| 64 |
+
const C_NAIVE = 0x8a6bff; // violet-blue (naive quantized reconstruction / naive bar)
|
| 65 |
+
const C_DIM = 0x42505d; // grey (degraded / no-live-data)
|
| 66 |
+
const C_ZERO = 0x5a6570; // grey (near-zero / axis)
|
| 67 |
+
const C_GRID = 0x1b3a44; // floor / link colour
|
| 68 |
+
|
| 69 |
+
// layout geometry
|
| 70 |
+
const SPEC_X0 = -6.0; // spectrum panel origin x
|
| 71 |
+
const SPEC_DX = 0.34; // world-units per eigenvalue bar
|
| 72 |
+
const SPEC_YSC = 0.16; // world-units per unit eigenvalue (log-ish handled in code)
|
| 73 |
+
const SPEC_BW = 0.14; // spectrum bar footprint
|
| 74 |
+
const W_X0 = -3.2; // weight-line panel origin x
|
| 75 |
+
const W_DX = 0.22; // world-units per weight coordinate
|
| 76 |
+
const W_YSC = 2.2; // world-units per unit weight value
|
| 77 |
+
const BAR_W = 0.7; // metric bar width
|
| 78 |
+
|
| 79 |
+
let _stage = null, _THREE = null, _ctx = null, _group = null, _overlay = null;
|
| 80 |
+
let _frameReg = false, _polls = [], _el = {}, _badge = null;
|
| 81 |
+
let _plain = false;
|
| 82 |
+
|
| 83 |
+
// geometry handles
|
| 84 |
+
let _floor = null;
|
| 85 |
+
let _specGroup = null; // THREE.Group — Hessian eigenvalue bars (before/after)
|
| 86 |
+
let _specBefore = []; // Array<THREE.Mesh> — raw-λ bars
|
| 87 |
+
let _specAfter = []; // Array<THREE.Mesh> — transformed-λ bars
|
| 88 |
+
let _wGroup = null; // THREE.Group — weight reconstruction lines
|
| 89 |
+
let _barGroup = null; // THREE.Group — metric bars
|
| 90 |
+
let _barMseN = null; // naive MSE bar
|
| 91 |
+
let _barMseH = null; // HeRo-Q MSE bar
|
| 92 |
+
let _barLossN = null; // naive loss-proxy bar
|
| 93 |
+
let _barLossH = null; // HeRo-Q loss-proxy bar
|
| 94 |
+
|
| 95 |
+
// live state
|
| 96 |
+
const S = {
|
| 97 |
+
label: null,
|
| 98 |
+
size: null,
|
| 99 |
+
bits: null,
|
| 100 |
+
levels: null,
|
| 101 |
+
eigs: null, // hessian_eigs
|
| 102 |
+
maxBefore: null, // max_hessian_eig_before
|
| 103 |
+
maxAfter: null, // max_hessian_eig_after
|
| 104 |
+
eigRed: null, // eig_reduction_factor
|
| 105 |
+
condBefore: null, // cond_before
|
| 106 |
+
condAfter: null, // cond_after
|
| 107 |
+
mseNaive: null, // quant_mse_naive
|
| 108 |
+
mseHerotq: null, // quant_mse_herotq
|
| 109 |
+
lossNaive: null, // loss_proxy_naive
|
| 110 |
+
lossHerotq: null, // loss_proxy_herotq
|
| 111 |
+
lossRed: null, // loss_reduction_factor
|
| 112 |
+
paradox: null, // low_error_high_loss
|
| 113 |
+
wRaw: null, // weight_raw
|
| 114 |
+
wNaive: null, // weight_naive_q
|
| 115 |
+
wHerotq: null, // weight_herotq_q
|
| 116 |
+
state: "init",
|
| 117 |
+
};
|
| 118 |
+
|
| 119 |
+
// =============================================================================
|
| 120 |
+
// mount(ctx)
|
| 121 |
+
// =============================================================================
|
| 122 |
+
export function mount(ctx) {
|
| 123 |
+
_ctx = ctx; _stage = ctx.stage; _THREE = ctx.THREE;
|
| 124 |
+
_group = new _THREE.Group();
|
| 125 |
+
_stage.scene.add(_group);
|
| 126 |
+
_stage.camera.position.set(2, 7, 18);
|
| 127 |
+
try { if (_stage.controls && _stage.controls.target) { _stage.controls.target.set(0, 1.5, 0); _stage.controls.update(); } } catch (_) {}
|
| 128 |
+
try { _stage.setBloom(true); } catch (_) {}
|
| 129 |
+
|
| 130 |
+
_buildFloor();
|
| 131 |
+
_buildSpectrum();
|
| 132 |
+
_buildWeights();
|
| 133 |
+
_buildBars();
|
| 134 |
+
|
| 135 |
+
if (!_frameReg) { _stage.onFrame(_onFrame); _frameReg = true; }
|
| 136 |
+
|
| 137 |
+
_badge = ctx.live.createBadge();
|
| 138 |
+
_polls.push(ctx.live.poll(EP, 5000, _onHerotq, { badge: _badge, onState: (msg) => { S.state = msg.state; _updateAll(); _paintOverlay(); } }));
|
| 139 |
+
|
| 140 |
+
_buildOverlay();
|
| 141 |
+
return { id: ID, started: true };
|
| 142 |
+
}
|
| 143 |
+
|
| 144 |
+
// =============================================================================
|
| 145 |
+
// builders
|
| 146 |
+
// =============================================================================
|
| 147 |
+
function _buildFloor() {
|
| 148 |
+
const THREE = _THREE;
|
| 149 |
+
const grid = new THREE.GridHelper(44, 44, C_GRID, 0x0f2027);
|
| 150 |
+
grid.material.opacity = 0.18; grid.material.transparent = true; grid.position.y = -0.01;
|
| 151 |
+
_group.add(grid);
|
| 152 |
+
_floor = grid;
|
| 153 |
+
}
|
| 154 |
+
|
| 155 |
+
// Hessian spectrum panel: two rows of bars — raw λ (before, lattice-blue) at the
|
| 156 |
+
// back, transformed λ/s² (after, proof-teal) in front. Pre-allocate a fixed cap
|
| 157 |
+
// and toggle visibility/height in place (no churn).
|
| 158 |
+
const SPEC_MAX = 64;
|
| 159 |
+
function _buildSpectrum() {
|
| 160 |
+
const THREE = _THREE;
|
| 161 |
+
_specGroup = new THREE.Group();
|
| 162 |
+
_specGroup.position.set(SPEC_X0, 0, -2.6);
|
| 163 |
+
_group.add(_specGroup);
|
| 164 |
+
const geo = new THREE.BoxGeometry(SPEC_BW, 1.0, SPEC_BW);
|
| 165 |
+
|
| 166 |
+
function makeRow(zoff, color, arr) {
|
| 167 |
+
for (let i = 0; i < SPEC_MAX; i++) {
|
| 168 |
+
const mesh = new THREE.Mesh(
|
| 169 |
+
geo,
|
| 170 |
+
new THREE.MeshStandardMaterial({ color, emissive: color, emissiveIntensity: 0.32, transparent: true, opacity: 0.9 }),
|
| 171 |
+
);
|
| 172 |
+
mesh.position.set(i * SPEC_DX, 0.02, zoff);
|
| 173 |
+
mesh.scale.y = 0.02;
|
| 174 |
+
mesh.visible = false;
|
| 175 |
+
_specGroup.add(mesh);
|
| 176 |
+
arr.push(mesh);
|
| 177 |
+
}
|
| 178 |
+
}
|
| 179 |
+
makeRow(0.0, C_BEFORE, _specBefore);
|
| 180 |
+
makeRow(0.9, C_AFTER, _specAfter);
|
| 181 |
+
}
|
| 182 |
+
|
| 183 |
+
// weight reconstruction panel: three polylines rebuilt in place on fresh data.
|
| 184 |
+
function _buildWeights() {
|
| 185 |
+
const THREE = _THREE;
|
| 186 |
+
_wGroup = new THREE.Group();
|
| 187 |
+
_wGroup.position.set(W_X0, 1.4, 3.0);
|
| 188 |
+
_group.add(_wGroup);
|
| 189 |
+
// lines are added by _updateWeights once data arrives
|
| 190 |
+
}
|
| 191 |
+
|
| 192 |
+
function _buildBars() {
|
| 193 |
+
const THREE = _THREE;
|
| 194 |
+
_barGroup = new THREE.Group();
|
| 195 |
+
_barGroup.position.set(5.4, 0, 0.4);
|
| 196 |
+
_group.add(_barGroup);
|
| 197 |
+
const geo = new THREE.BoxGeometry(BAR_W, 1.0, BAR_W);
|
| 198 |
+
|
| 199 |
+
function mk(x, color) {
|
| 200 |
+
const m = new THREE.Mesh(
|
| 201 |
+
geo,
|
| 202 |
+
new THREE.MeshStandardMaterial({ color, emissive: color, emissiveIntensity: 0.35, transparent: true, opacity: 0.9 }),
|
| 203 |
+
);
|
| 204 |
+
m.position.set(x, 0.02, 0);
|
| 205 |
+
m.scale.y = 0.02;
|
| 206 |
+
_barGroup.add(m);
|
| 207 |
+
return m;
|
| 208 |
+
}
|
| 209 |
+
// MSE pair (front row), loss pair (back row)
|
| 210 |
+
_barMseN = mk(0.0, C_NAIVE);
|
| 211 |
+
_barMseH = mk(0.95, C_AFTER);
|
| 212 |
+
_barLossN = mk(0.0, C_NAIVE); _barLossN.position.z = 1.6;
|
| 213 |
+
_barLossH = mk(0.95, C_AFTER); _barLossH.position.z = 1.6;
|
| 214 |
+
}
|
| 215 |
+
|
| 216 |
+
// =============================================================================
|
| 217 |
+
// live data handler
|
| 218 |
+
// =============================================================================
|
| 219 |
+
function _onHerotq(j) {
|
| 220 |
+
// read honesty label VERBATIM — never upgrade. handle top-level 'label' OR
|
| 221 |
+
// nested 'payload.label' to match our own module's shape.
|
| 222 |
+
const lbl = (j && j.label != null) ? j.label
|
| 223 |
+
: (j && j.payload && j.payload.label != null) ? j.payload.label
|
| 224 |
+
: "MODELED";
|
| 225 |
+
const src = (j && j.payload && typeof j.payload === "object") ? j.payload : j;
|
| 226 |
+
S.label = String(lbl).toUpperCase();
|
| 227 |
+
|
| 228 |
+
S.size = typeof src.size === "number" ? src.size : null;
|
| 229 |
+
S.bits = typeof src.bits === "number" ? src.bits : null;
|
| 230 |
+
S.levels = typeof src.levels === "number" ? src.levels : null;
|
| 231 |
+
S.maxBefore = typeof src.max_hessian_eig_before === "number" ? src.max_hessian_eig_before : null;
|
| 232 |
+
S.maxAfter = typeof src.max_hessian_eig_after === "number" ? src.max_hessian_eig_after : null;
|
| 233 |
+
S.eigRed = typeof src.eig_reduction_factor === "number" ? src.eig_reduction_factor : null;
|
| 234 |
+
S.condBefore = typeof src.cond_before === "number" ? src.cond_before : null;
|
| 235 |
+
S.condAfter = typeof src.cond_after === "number" ? src.cond_after : null;
|
| 236 |
+
S.mseNaive = typeof src.quant_mse_naive === "number" ? src.quant_mse_naive : null;
|
| 237 |
+
S.mseHerotq = typeof src.quant_mse_herotq === "number" ? src.quant_mse_herotq : null;
|
| 238 |
+
S.lossNaive = typeof src.loss_proxy_naive === "number" ? src.loss_proxy_naive : null;
|
| 239 |
+
S.lossHerotq = typeof src.loss_proxy_herotq === "number" ? src.loss_proxy_herotq : null;
|
| 240 |
+
S.lossRed = typeof src.loss_reduction_factor === "number" ? src.loss_reduction_factor : null;
|
| 241 |
+
S.paradox = typeof src.low_error_high_loss === "boolean" ? src.low_error_high_loss : null;
|
| 242 |
+
|
| 243 |
+
S.eigs = Array.isArray(src.hessian_eigs) ? src.hessian_eigs : null;
|
| 244 |
+
S.wRaw = Array.isArray(src.weight_raw) ? src.weight_raw : null;
|
| 245 |
+
S.wNaive = Array.isArray(src.weight_naive_q) ? src.weight_naive_q : null;
|
| 246 |
+
S.wHerotq = Array.isArray(src.weight_herotq_q)? src.weight_herotq_q: null;
|
| 247 |
+
|
| 248 |
+
_updateAll();
|
| 249 |
+
_paintOverlay();
|
| 250 |
+
}
|
| 251 |
+
|
| 252 |
+
// =============================================================================
|
| 253 |
+
// geometry updaters
|
| 254 |
+
// =============================================================================
|
| 255 |
+
function _updateAll() {
|
| 256 |
+
_updateSpectrum();
|
| 257 |
+
_updateWeights();
|
| 258 |
+
_updateBars();
|
| 259 |
+
}
|
| 260 |
+
|
| 261 |
+
// height ∝ log10(1+λ) so tall stiff directions and flat ones are both legible.
|
| 262 |
+
function _lh(v) { return Math.max(0.03, Math.log10(1.0 + Math.max(0.0, v)) * 3.0); }
|
| 263 |
+
|
| 264 |
+
function _updateSpectrum() {
|
| 265 |
+
const live = S.state === "live";
|
| 266 |
+
const eigs = (live && S.eigs) ? S.eigs : null;
|
| 267 |
+
// "after" spectrum is reconstructed geometrically: the flattened spectrum has
|
| 268 |
+
// the same count but is capped at max_hessian_eig_after (the measured λ_max
|
| 269 |
+
// the grid must resolve); we scale each raw λ toward that ceiling so the
|
| 270 |
+
// visual monotonically maps the measured reduction without fabricating values.
|
| 271 |
+
const n = eigs ? Math.min(eigs.length, SPEC_MAX) : 0;
|
| 272 |
+
const capAfter = (S.maxAfter != null) ? S.maxAfter : 0.0;
|
| 273 |
+
const maxRaw = (eigs && eigs.length) ? Math.max.apply(null, eigs) : 1.0;
|
| 274 |
+
|
| 275 |
+
for (let i = 0; i < SPEC_MAX; i++) {
|
| 276 |
+
const b = _specBefore[i], a = _specAfter[i];
|
| 277 |
+
if (!live || i >= n) {
|
| 278 |
+
if (b) { b.visible = false; }
|
| 279 |
+
if (a) { a.visible = false; }
|
| 280 |
+
continue;
|
| 281 |
+
}
|
| 282 |
+
const lam = eigs[i];
|
| 283 |
+
// before bar
|
| 284 |
+
b.visible = true;
|
| 285 |
+
let hb = _lh(lam);
|
| 286 |
+
b.scale.y = hb; b.position.y = hb * 0.5;
|
| 287 |
+
b.material.color.setHex(C_BEFORE); b.material.emissive.setHex(C_BEFORE);
|
| 288 |
+
b.material.opacity = 0.9;
|
| 289 |
+
// after bar: transformed curvature the grid resolves is bounded by capAfter.
|
| 290 |
+
// map λ proportionally into [0, capAfter] so stiff directions collapse.
|
| 291 |
+
a.visible = true;
|
| 292 |
+
const lamAfter = maxRaw > 0 ? (lam / maxRaw) * capAfter : 0.0;
|
| 293 |
+
let ha = _lh(lamAfter);
|
| 294 |
+
a.scale.y = ha; a.position.y = ha * 0.5;
|
| 295 |
+
a.material.color.setHex(C_AFTER); a.material.emissive.setHex(C_AFTER);
|
| 296 |
+
a.material.opacity = 0.9;
|
| 297 |
+
}
|
| 298 |
+
}
|
| 299 |
+
|
| 300 |
+
// rebuild the three weight polylines (raw / naive / HeRo-Q) from live data.
|
| 301 |
+
function _updateWeights() {
|
| 302 |
+
const THREE = _THREE;
|
| 303 |
+
if (!_wGroup) return;
|
| 304 |
+
// dispose previous children
|
| 305 |
+
for (let i = _wGroup.children.length - 1; i >= 0; i--) {
|
| 306 |
+
const o = _wGroup.children[i];
|
| 307 |
+
if (o.geometry && o.geometry.dispose) o.geometry.dispose();
|
| 308 |
+
if (o.material) {
|
| 309 |
+
const ms = Array.isArray(o.material) ? o.material : [o.material];
|
| 310 |
+
ms.forEach((m) => { if (m.dispose) m.dispose(); });
|
| 311 |
+
}
|
| 312 |
+
_wGroup.remove(o);
|
| 313 |
+
}
|
| 314 |
+
const live = S.state === "live";
|
| 315 |
+
if (!live) return;
|
| 316 |
+
|
| 317 |
+
function addLine(arr, color, op) {
|
| 318 |
+
if (!Array.isArray(arr) || !arr.length) return;
|
| 319 |
+
const pts = [];
|
| 320 |
+
for (let i = 0; i < arr.length; i++) {
|
| 321 |
+
const v = typeof arr[i] === "number" ? arr[i] : 0.0;
|
| 322 |
+
pts.push(new THREE.Vector3(i * W_DX, v * W_YSC, 0));
|
| 323 |
+
}
|
| 324 |
+
const lg = new THREE.BufferGeometry().setFromPoints(pts);
|
| 325 |
+
const lm = new THREE.LineBasicMaterial({ color, transparent: true, opacity: op });
|
| 326 |
+
_wGroup.add(new THREE.Line(lg, lm));
|
| 327 |
+
}
|
| 328 |
+
addLine(S.wRaw, C_BEFORE, 0.85);
|
| 329 |
+
addLine(S.wNaive, C_NAIVE, 0.7);
|
| 330 |
+
addLine(S.wHerotq, C_AFTER, 0.9);
|
| 331 |
+
}
|
| 332 |
+
|
| 333 |
+
// metric bars: MSE pair + loss-proxy pair. height on independent normalizers so
|
| 334 |
+
// each pair is legible; the honest STORY is naive-MSE lower, naive-loss higher.
|
| 335 |
+
function _updateBars() {
|
| 336 |
+
const live = S.state === "live";
|
| 337 |
+
function setBar(mesh, val, refMax, color) {
|
| 338 |
+
if (!mesh) return;
|
| 339 |
+
if (!live || val == null) {
|
| 340 |
+
mesh.material.color.setHex(C_DIM);
|
| 341 |
+
mesh.material.emissive.setHex(C_DIM);
|
| 342 |
+
mesh.material.opacity = 0.3;
|
| 343 |
+
mesh.scale.y = 0.02; mesh.position.y = 0.01;
|
| 344 |
+
return;
|
| 345 |
+
}
|
| 346 |
+
const denom = refMax > 1e-12 ? refMax : 1.0;
|
| 347 |
+
const h = Math.max(0.05, (val / denom) * 3.4);
|
| 348 |
+
mesh.scale.y = h; mesh.position.y = h * 0.5;
|
| 349 |
+
mesh.material.color.setHex(color);
|
| 350 |
+
mesh.material.emissive.setHex(color);
|
| 351 |
+
mesh.material.emissiveIntensity = 0.4;
|
| 352 |
+
mesh.material.opacity = 0.92;
|
| 353 |
+
}
|
| 354 |
+
const mseMax = Math.max(S.mseNaive || 0, S.mseHerotq || 0);
|
| 355 |
+
const lossMax = Math.max(S.lossNaive || 0, S.lossHerotq || 0);
|
| 356 |
+
setBar(_barMseN, S.mseNaive, mseMax, C_NAIVE);
|
| 357 |
+
setBar(_barMseH, S.mseHerotq, mseMax, C_AFTER);
|
| 358 |
+
setBar(_barLossN, S.lossNaive, lossMax, C_NAIVE);
|
| 359 |
+
setBar(_barLossH, S.lossHerotq, lossMax, C_AFTER);
|
| 360 |
+
}
|
| 361 |
+
|
| 362 |
+
// =============================================================================
|
| 363 |
+
// per-frame animation
|
| 364 |
+
// =============================================================================
|
| 365 |
+
function _onFrame() {
|
| 366 |
+
const t = performance.now();
|
| 367 |
+
if (_group) _group.rotation.y = Math.sin(t * 0.00008) * 0.12;
|
| 368 |
+
}
|
| 369 |
+
|
| 370 |
+
// =============================================================================
|
| 371 |
+
// overlay
|
| 372 |
+
// =============================================================================
|
| 373 |
+
function _buildOverlay() {
|
| 374 |
+
const ctx = _ctx;
|
| 375 |
+
_overlay = document.createElement("div");
|
| 376 |
+
Object.assign(_overlay.style, {
|
| 377 |
+
position: "absolute", left: "14px", top: "14px", zIndex: "6",
|
| 378 |
+
display: "flex", flexDirection: "column", gap: "8px",
|
| 379 |
+
maxWidth: "min(94%,470px)",
|
| 380 |
+
font: "12px ui-sans-serif,system-ui,Segoe UI,Roboto,Arial",
|
| 381 |
+
color: "#eef3f6",
|
| 382 |
+
});
|
| 383 |
+
|
| 384 |
+
const h = document.createElement("div");
|
| 385 |
+
h.style.cssText = "font:600 13px ui-sans-serif,system-ui;letter-spacing:.4px";
|
| 386 |
+
h.textContent = TITLE;
|
| 387 |
+
_overlay.appendChild(h);
|
| 388 |
+
|
| 389 |
+
const sub = document.createElement("div");
|
| 390 |
+
sub.style.cssText = "color:#9fb1bf;font-size:11px;line-height:1.55";
|
| 391 |
+
sub.innerHTML =
|
| 392 |
+
'HeRo-Q (\u201cHessian Robust Quantization\u201d) fixes the <b>\u201clow error, high loss\u201d</b> paradox in ' +
|
| 393 |
+
'low-bit quantization: naive rounding minimizes weight ERROR, but the loss actually depends on the ' +
|
| 394 |
+
'<b>Hessian</b> \u2014 a few <b>high-curvature directions</b> (large eigenvalues) are extremely ' +
|
| 395 |
+
'perturbation-sensitive. HeRo-Q applies a <b>rotation-compression</b> transform in the Hessian ' +
|
| 396 |
+
'eigenbasis (w<sub>q</sub> = V(s<sup>\u22121</sup>\u2299q(s\u2299V\u1d40w)), s<sub>i</sub>=\u221a(1+\u03bb<sub>i</sub>/\u03bb<sub>med</sub>)) that ' +
|
| 397 |
+
'<b>reduces the largest Hessian eigenvalue</b> before quantizing. Panels: Hessian spectrum ' +
|
| 398 |
+
'(before vs after), weight reconstruction (raw / naive / HeRo-Q), metric bars (quant MSE & ' +
|
| 399 |
+
'curvature-weighted loss ½\u00b7\u0394w\u1d40H\u0394w). Honesty label <b>MODELED</b> (deterministic mechanism ' +
|
| 400 |
+
'reproduction on a toy matrix; quantizes nothing real). 0 runtime CDN.';
|
| 401 |
+
_overlay.appendChild(sub);
|
| 402 |
+
|
| 403 |
+
const brow = document.createElement("div");
|
| 404 |
+
brow.style.cssText = "display:flex;gap:8px;align-items:center;flex-wrap:wrap";
|
| 405 |
+
if (_badge && _badge.el) brow.appendChild(_badge.el);
|
| 406 |
+
_overlay.appendChild(brow);
|
| 407 |
+
|
| 408 |
+
const card = document.createElement("div");
|
| 409 |
+
card.style.cssText = "background:#0a1117;border:1px solid #1d2a36;border-radius:9px;padding:9px 10px;display:flex;flex-direction:column;gap:6px";
|
| 410 |
+
|
| 411 |
+
const chead = document.createElement("div");
|
| 412 |
+
chead.style.cssText = "display:flex;align-items:center;gap:8px;flex-wrap:wrap";
|
| 413 |
+
const dot = document.createElement("span");
|
| 414 |
+
dot.style.cssText = "width:9px;height:9px;border-radius:50%;background:#3af4c8;box-shadow:0 0 7px #3af4c8";
|
| 415 |
+
const nm = document.createElement("b");
|
| 416 |
+
nm.style.cssText = "font-size:12px;color:#3af4c8;letter-spacing:.3px";
|
| 417 |
+
nm.textContent = "hero-q hessian-conditioned quantization";
|
| 418 |
+
chead.appendChild(dot); chead.appendChild(nm);
|
| 419 |
+
card.appendChild(chead);
|
| 420 |
+
|
| 421 |
+
const grid = document.createElement("div");
|
| 422 |
+
grid.style.cssText = "display:grid;grid-template-columns:1fr;gap:4px";
|
| 423 |
+
|
| 424 |
+
function kpiRow(id, label) {
|
| 425 |
+
const r = document.createElement("div");
|
| 426 |
+
r.style.cssText = "display:flex;justify-content:space-between;gap:10px;font-size:11px";
|
| 427 |
+
const l = document.createElement("span"); l.style.cssText = "color:#9fb1bf"; l.textContent = label;
|
| 428 |
+
const v = document.createElement("b");
|
| 429 |
+
v.id = id;
|
| 430 |
+
v.style.cssText = "font-variant-numeric:tabular-nums;color:#eef3f6;text-align:right;max-width:56%";
|
| 431 |
+
v.textContent = "\u2014";
|
| 432 |
+
_el[id] = v;
|
| 433 |
+
r.appendChild(l); r.appendChild(v); return r;
|
| 434 |
+
}
|
| 435 |
+
|
| 436 |
+
grid.appendChild(kpiRow("hq-size", "weight / Hessian size"));
|
| 437 |
+
grid.appendChild(kpiRow("hq-bits", "quantization bits (levels)"));
|
| 438 |
+
grid.appendChild(kpiRow("hq-eigb", "max Hessian \u03bb \u2014 BEFORE"));
|
| 439 |
+
grid.appendChild(kpiRow("hq-eiga", "max Hessian \u03bb \u2014 AFTER"));
|
| 440 |
+
grid.appendChild(kpiRow("hq-eigr", "eigenvalue reduction"));
|
| 441 |
+
grid.appendChild(kpiRow("hq-cond", "condition \u03ba (before \u2192 after)"));
|
| 442 |
+
grid.appendChild(kpiRow("hq-msen", "quant MSE \u2014 naive"));
|
| 443 |
+
grid.appendChild(kpiRow("hq-mseh", "quant MSE \u2014 HeRo-Q"));
|
| 444 |
+
grid.appendChild(kpiRow("hq-lossn", "loss-proxy \u00bd\u0394w\u1d40H\u0394w \u2014 naive"));
|
| 445 |
+
grid.appendChild(kpiRow("hq-lossh", "loss-proxy \u00bd\u0394w\u1d40H\u0394w \u2014 HeRo-Q"));
|
| 446 |
+
grid.appendChild(kpiRow("hq-lossr", "loss reduction"));
|
| 447 |
+
grid.appendChild(kpiRow("hq-para", "\u201clow error, high loss\u201d (naive)"));
|
| 448 |
+
grid.appendChild(kpiRow("hq-label", "honesty label"));
|
| 449 |
+
card.appendChild(grid);
|
| 450 |
+
|
| 451 |
+
const fn = document.createElement("div");
|
| 452 |
+
fn.style.cssText = "font-size:9.5px;color:#6b7a86;line-height:1.5";
|
| 453 |
+
fn.textContent = "HeRo-Q \u2014 Zhang, Jinhao et al. \u201cHeRo-Q: A General Framework for Stable Low Bit Quantization via Hessian Conditioning\u201d arXiv:2601.21626. MODELED \u00b7 Hessian-conditioning demo on a toy matrix, not a trained model. Does NOT reproduce the GSM8K/Llama3-8B numbers.";
|
| 454 |
+
card.appendChild(fn);
|
| 455 |
+
_overlay.appendChild(card);
|
| 456 |
+
|
| 457 |
+
const pl = document.createElement("button");
|
| 458 |
+
pl.textContent = "\u25d1 what this means";
|
| 459 |
+
pl.title = "Toggle plain-language explanation for investors & consumers.";
|
| 460 |
+
pl.style.cssText = "font:11px ui-monospace,monospace;padding:5px 11px;border-radius:7px;border:1px solid #3af4c8;background:#08140f;color:#3af4c8;cursor:pointer;width:fit-content";
|
| 461 |
+
pl.addEventListener("click", () => {
|
| 462 |
+
_plain = !_plain;
|
| 463 |
+
pl.style.background = _plain ? "#0f2a20" : "#08140f";
|
| 464 |
+
_applyPlain();
|
| 465 |
+
});
|
| 466 |
+
_overlay.appendChild(pl);
|
| 467 |
+
|
| 468 |
+
const pd = document.createElement("div");
|
| 469 |
+
pd.id = "hq-plain";
|
| 470 |
+
pd.style.cssText = "font-size:10.5px;color:#c9d6df;line-height:1.55;border:1px dashed #26333f;border-radius:7px;padding:7px 9px;display:none";
|
| 471 |
+
_el["plain"] = pd;
|
| 472 |
+
_overlay.appendChild(pd);
|
| 473 |
+
|
| 474 |
+
(ctx.container || document.body).appendChild(_overlay);
|
| 475 |
+
_paintOverlay();
|
| 476 |
+
}
|
| 477 |
+
|
| 478 |
+
function _applyPlain() {
|
| 479 |
+
const pd = _el["plain"];
|
| 480 |
+
if (!pd) return;
|
| 481 |
+
pd.style.display = _plain ? "block" : "none";
|
| 482 |
+
if (!_plain) return;
|
| 483 |
+
const eb = S.maxBefore != null ? S.maxBefore.toFixed(1) : "loading\u2026";
|
| 484 |
+
const ea = S.maxAfter != null ? S.maxAfter.toFixed(2) : "loading\u2026";
|
| 485 |
+
const er = S.eigRed != null ? S.eigRed.toFixed(1) + "\u00d7" : "loading\u2026";
|
| 486 |
+
const lr = S.lossRed != null ? S.lossRed.toFixed(1) + "\u00d7" : "loading\u2026";
|
| 487 |
+
pd.innerHTML =
|
| 488 |
+
"<b>What this means:</b> To make a big model small and fast, we store its numbers with very few " +
|
| 489 |
+
"bits \u2014 like rounding prices to the nearest dollar. Plain rounding keeps the <b>numbers</b> close, " +
|
| 490 |
+
"but the model can still get much <b>worse</b>, because a few \u201cstiff\u201d directions matter far more " +
|
| 491 |
+
"than the rest (the \u201clow error, high loss\u201d paradox). HeRo-Q first <b>turns and rescales</b> the " +
|
| 492 |
+
"weights so those stiff directions get more of the rounding precision \u2014 like giving the most " +
|
| 493 |
+
"fragile items the most padding before shipping. Here the biggest \u201cstiffness\u201d (largest Hessian " +
|
| 494 |
+
"eigenvalue) drops from about <b>" + eb + "</b> to about <b>" + ea + "</b> \u2014 a <b>" + er + "</b> " +
|
| 495 |
+
"flattening \u2014 and the curvature-weighted error (the thing that actually hurts the model) falls by " +
|
| 496 |
+
"about <b>" + lr + "</b>, even though the raw rounding error is slightly larger. This view is a " +
|
| 497 |
+
"<b>MODELED</b> deterministic reproduction of that turn-and-rescale MECHANISM on a small synthetic " +
|
| 498 |
+
"matrix \u2014 it <b>quantizes no real model</b> and runs no benchmark. The paper\u2019s headline " +
|
| 499 |
+
"\u201c70.15% GSM8K on Llama3-8B at 3-bit\u201d is a <b>claim about a real model</b> the estate does not " +
|
| 500 |
+
"independently verify.";
|
| 501 |
+
}
|
| 502 |
+
|
| 503 |
+
function _tok(s) {
|
| 504 |
+
if (s === "live") return null;
|
| 505 |
+
if (s === "missing") return "NO-LIVE-DATA";
|
| 506 |
+
if (s === "degraded") return "DEGRADED";
|
| 507 |
+
if (s === "error") return "OFFLINE";
|
| 508 |
+
return "\u2026";
|
| 509 |
+
}
|
| 510 |
+
|
| 511 |
+
function fx(v, d) { return typeof v === "number" ? v.toFixed(d) : "\u2014"; }
|
| 512 |
+
function _set(id, v) { if (_el[id]) _el[id].textContent = v; }
|
| 513 |
+
|
| 514 |
+
function _paintOverlay() {
|
| 515 |
+
const t = _tok(S.state);
|
| 516 |
+
_set("hq-size", t || (S.size != null ? String(S.size) : "\u2014"));
|
| 517 |
+
_set("hq-bits", t || ((S.bits != null && S.levels != null) ? (S.bits + "-bit (" + S.levels + " levels)") : "\u2014"));
|
| 518 |
+
_set("hq-eigb", t || fx(S.maxBefore, 3));
|
| 519 |
+
_set("hq-eiga", t || fx(S.maxAfter, 3));
|
| 520 |
+
_set("hq-eigr", t || (S.eigRed != null ? S.eigRed.toFixed(1) + "\u00d7" : "\u2014"));
|
| 521 |
+
_set("hq-cond", t || ((S.condBefore != null && S.condAfter != null) ? (fx(S.condBefore, 1) + " \u2192 " + fx(S.condAfter, 2)) : "\u2014"));
|
| 522 |
+
_set("hq-msen", t || fx(S.mseNaive, 5));
|
| 523 |
+
_set("hq-mseh", t || fx(S.mseHerotq, 5));
|
| 524 |
+
_set("hq-lossn", t || fx(S.lossNaive, 4));
|
| 525 |
+
_set("hq-lossh", t || fx(S.lossHerotq, 4));
|
| 526 |
+
_set("hq-lossr", t || (S.lossRed != null ? S.lossRed.toFixed(1) + "\u00d7" : "\u2014"));
|
| 527 |
+
_set("hq-para", t || (S.paradox != null ? (S.paradox ? "PRESENT \u2192 fixed" : "\u2014") : "\u2014"));
|
| 528 |
+
// honesty label verbatim — never upgraded
|
| 529 |
+
_set("hq-label", t || (S.label || "MODELED"));
|
| 530 |
+
if (_plain) _applyPlain();
|
| 531 |
+
}
|
| 532 |
+
|
| 533 |
+
// =============================================================================
|
| 534 |
+
// unmount — clean up everything; must not affect other organs
|
| 535 |
+
// =============================================================================
|
| 536 |
+
export function unmount() {
|
| 537 |
+
_polls.forEach((p) => { try { p.stop(); } catch (_) {} }); _polls = [];
|
| 538 |
+
try { if (_overlay && _overlay.parentNode) _overlay.parentNode.removeChild(_overlay); } catch (_) {}
|
| 539 |
+
try {
|
| 540 |
+
if (_group && _stage) {
|
| 541 |
+
_group.traverse((o) => {
|
| 542 |
+
if (o.geometry && o.geometry.dispose) o.geometry.dispose();
|
| 543 |
+
if (o.material) {
|
| 544 |
+
const ms = Array.isArray(o.material) ? o.material : [o.material];
|
| 545 |
+
ms.forEach((m) => { if (m.dispose) m.dispose(); });
|
| 546 |
+
}
|
| 547 |
+
});
|
| 548 |
+
_stage.scene.remove(_group);
|
| 549 |
+
}
|
| 550 |
+
} catch (_) {}
|
| 551 |
+
_group = _overlay = null;
|
| 552 |
+
_floor = null;
|
| 553 |
+
_specGroup = null; _specBefore = []; _specAfter = [];
|
| 554 |
+
_wGroup = null;
|
| 555 |
+
_barGroup = null; _barMseN = _barMseH = _barLossN = _barLossH = null;
|
| 556 |
+
_el = {}; _badge = null; _plain = false; _frameReg = false;
|
| 557 |
+
_stage = _THREE = _ctx = null;
|
| 558 |
+
S.label = S.size = S.bits = S.levels = null;
|
| 559 |
+
S.eigs = null;
|
| 560 |
+
S.maxBefore = S.maxAfter = S.eigRed = S.condBefore = S.condAfter = null;
|
| 561 |
+
S.mseNaive = S.mseHerotq = S.lossNaive = S.lossHerotq = S.lossRed = null;
|
| 562 |
+
S.paradox = null;
|
| 563 |
+
S.wRaw = S.wNaive = S.wHerotq = null;
|
| 564 |
+
S.state = "init";
|
| 565 |
+
}
|
| 566 |
+
|
| 567 |
+
export default { id: ID, title: TITLE, endpoints: [EP], mount, unmount };
|
static/3d/surfaces/keyless.js
ADDED
|
@@ -0,0 +1,506 @@
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 1 |
+
// SPDX-License-Identifier: Apache-2.0
|
| 2 |
+
// © 2026 Lutar, Stephen P. — SZL Holdings · ORCID 0009-0001-0110-4173 · Doctrine v11
|
| 3 |
+
//
|
| 4 |
+
// surfaces/keyless.js — KEYLESS ATTENTION (VALUE-ONLY CACHE) organ for the
|
| 5 |
+
// holographic frontier ring (Xin Gao, arXiv:2606.21848). Renders the
|
| 6 |
+
// value-only-cache mechanism vs standard QKV attention as three live panels:
|
| 7 |
+
// (1) CACHE-SIZE BARS — standard cache (K+V = 2·L·d) vs keyless cache
|
| 8 |
+
// (V-only = L·d), the exact 50% shrink shown as two boxes;
|
| 9 |
+
// (2) ATTENTION-MAP HEATMAPS — the standard softmax(Q·Kᵀ/√d) map vs the
|
| 10 |
+
// keyless softmax((Q·R)·Vᵀ/√d) map, as two grids of coloured cells;
|
| 11 |
+
// (3) OUTPUT-FIDELITY BAR — mean per-token cosine similarity between the two
|
| 12 |
+
// attention outputs, the MEASURED "matches within X on the toy" metric.
|
| 13 |
+
// A HUD reports the MEASURED metrics from the live snapshot at
|
| 14 |
+
// /api/killinchu/v1/keyless/attention. Honesty label "MODELED" is read
|
| 15 |
+
// VERBATIM from the JSON and displayed as-is; it is never upgraded.
|
| 16 |
+
//
|
| 17 |
+
// Surface export shape (mirrors muon.js exactly):
|
| 18 |
+
// export default { id, title, endpoints, mount(ctx), unmount() }
|
| 19 |
+
// ctx = { stage, container, live, label, THREE, szl3d }
|
| 20 |
+
//
|
| 21 |
+
// DATA SHOWN (all from live endpoint):
|
| 22 |
+
// L, d, m, bytes_per_entry, kv_entries_standard, kv_entries_keyless,
|
| 23 |
+
// kv_bytes_standard, kv_bytes_keyless, reduction_pct, cosine_mean,
|
| 24 |
+
// cosine_min, mse, scores_std_head[[...]], scores_keyless_head[[...]]
|
| 25 |
+
//
|
| 26 |
+
// LEADERS ADOPTED & CITED (clean-room; NOT claimed as SZL's own; VERIFIED real):
|
| 27 |
+
// Keyless Attention: Value-Space Routing and Value-Only Caching for Efficient
|
| 28 |
+
// Transformers — Xin Gao. arXiv:2606.21848
|
| 29 |
+
// https://arxiv.org/abs/2606.21848
|
| 30 |
+
//
|
| 31 |
+
// HONESTY LABELS: MODELED (deterministic reproduction of the value-only-cache +
|
| 32 |
+
// value-space-routing MECHANISM on a toy synthetic sequence; NOT a trained
|
| 33 |
+
// transformer; trains nothing; the 50% cache shrink is exact arithmetic and
|
| 34 |
+
// the output fidelity is MEASURED; NEVER-CLAIMED-AS a production kernel).
|
| 35 |
+
// Read verbatim from JSON.
|
| 36 |
+
// COLOURS: lattice-blue 0x5b8dee, violet-blue 0x8a6bff, proof-teal 0x3af4c8,
|
| 37 |
+
// greys (0x5a6570 / 0x42505d). Purple BANNED as UI/background.
|
| 38 |
+
// 0 RUNTIME CDN. Vendored three.js via ctx.THREE (page importmap).
|
| 39 |
+
// DOCTRINE v11: degrades gracefully (grey) on 404/error; honesty label still shown.
|
| 40 |
+
// Nothing here is in the locked-8. Λ stays Conjecture 1. Trust never 100%.
|
| 41 |
+
|
| 42 |
+
const ID = "keyless";
|
| 43 |
+
const TITLE = "Keyless Attention (Value-Only Cache)";
|
| 44 |
+
|
| 45 |
+
// Endpoint is hosted on the dedicated killinchu Space (isolated compute),
|
| 46 |
+
// reached cross-origin (killinchu returns access-control-allow-origin).
|
| 47 |
+
const EP = "https://szlholdings-killinchu.hf.space/api/killinchu/v1/keyless/attention?seed=42&L=16&d=16&m=3";
|
| 48 |
+
|
| 49 |
+
// data-viz hues — purple BANNED
|
| 50 |
+
const C_STD = 0x5b8dee; // lattice-blue (standard cache bar / std heatmap)
|
| 51 |
+
const C_KEYLESS = 0x3af4c8; // proof-teal (keyless cache bar / keyless heatmap)
|
| 52 |
+
const C_FID = 0x8a6bff; // violet-blue (output-fidelity bar)
|
| 53 |
+
const C_DIM = 0x42505d; // grey (degraded / no-live-data)
|
| 54 |
+
const C_ZERO = 0x5a6570; // grey (near-zero heatmap cell)
|
| 55 |
+
const C_GRID = 0x1b3a44; // floor / link colour
|
| 56 |
+
|
| 57 |
+
// layout geometry
|
| 58 |
+
const HEAT_CELL = 0.16; // heatmap cell size
|
| 59 |
+
const HEAT_GAP = 0.17; // heatmap cell pitch
|
| 60 |
+
const HEAT_MAX = 8; // cap cells per axis rendered (matches head trim)
|
| 61 |
+
const BAR_W = 0.9; // cache-bar width
|
| 62 |
+
|
| 63 |
+
let _stage = null, _THREE = null, _ctx = null, _group = null, _overlay = null;
|
| 64 |
+
let _frameReg = false, _polls = [], _el = {}, _badge = null;
|
| 65 |
+
let _plain = false;
|
| 66 |
+
|
| 67 |
+
// geometry handles
|
| 68 |
+
let _floor = null;
|
| 69 |
+
let _heatStd = []; // Array<THREE.Mesh> — standard attention-map cells
|
| 70 |
+
let _heatKeyless= []; // Array<THREE.Mesh> — keyless attention-map cells
|
| 71 |
+
let _heatGroup = null;
|
| 72 |
+
let _barStd = null; // THREE.Mesh — standard cache-size bar (K+V)
|
| 73 |
+
let _barKeyless = null; // THREE.Mesh — keyless cache-size bar (V-only)
|
| 74 |
+
let _barFid = null; // THREE.Mesh — output-fidelity (cosine) bar
|
| 75 |
+
let _barGroup = null;
|
| 76 |
+
|
| 77 |
+
// live state
|
| 78 |
+
const S = {
|
| 79 |
+
label: null,
|
| 80 |
+
L: null,
|
| 81 |
+
d: null,
|
| 82 |
+
m: null,
|
| 83 |
+
bytesPer: null, // bytes_per_entry
|
| 84 |
+
kvEntStd: null, // kv_entries_standard
|
| 85 |
+
kvEntKey: null, // kv_entries_keyless
|
| 86 |
+
kvBytesStd: null, // kv_bytes_standard
|
| 87 |
+
kvBytesKey: null, // kv_bytes_keyless
|
| 88 |
+
reduction: null, // reduction_pct
|
| 89 |
+
cosMean: null, // cosine_mean
|
| 90 |
+
cosMin: null, // cosine_min
|
| 91 |
+
mse: null,
|
| 92 |
+
scoresStd: null, // Array<Array<number>>
|
| 93 |
+
scoresKey: null, // Array<Array<number>>
|
| 94 |
+
state: "init",
|
| 95 |
+
};
|
| 96 |
+
|
| 97 |
+
// =============================================================================
|
| 98 |
+
// mount(ctx)
|
| 99 |
+
// =============================================================================
|
| 100 |
+
export function mount(ctx) {
|
| 101 |
+
_ctx = ctx; _stage = ctx.stage; _THREE = ctx.THREE;
|
| 102 |
+
_group = new _THREE.Group();
|
| 103 |
+
_stage.scene.add(_group);
|
| 104 |
+
_stage.camera.position.set(5, 6, 16);
|
| 105 |
+
try { if (_stage.controls && _stage.controls.target) { _stage.controls.target.set(2, 1.5, 0); _stage.controls.update(); } } catch (_) {}
|
| 106 |
+
try { _stage.setBloom(true); } catch (_) {}
|
| 107 |
+
|
| 108 |
+
_buildFloor();
|
| 109 |
+
_buildHeatmaps();
|
| 110 |
+
_buildBars();
|
| 111 |
+
|
| 112 |
+
if (!_frameReg) { _stage.onFrame(_onFrame); _frameReg = true; }
|
| 113 |
+
|
| 114 |
+
_badge = ctx.live.createBadge();
|
| 115 |
+
_polls.push(ctx.live.poll(EP, 5000, _onKeyless, { badge: _badge, onState: (msg) => { S.state = msg.state; _updateAll(); _paintOverlay(); } }));
|
| 116 |
+
|
| 117 |
+
_buildOverlay();
|
| 118 |
+
return { id: ID, started: true };
|
| 119 |
+
}
|
| 120 |
+
|
| 121 |
+
// =============================================================================
|
| 122 |
+
// builders
|
| 123 |
+
// =============================================================================
|
| 124 |
+
function _buildFloor() {
|
| 125 |
+
const THREE = _THREE;
|
| 126 |
+
const grid = new THREE.GridHelper(40, 40, C_GRID, 0x0f2027);
|
| 127 |
+
grid.material.opacity = 0.18; grid.material.transparent = true; grid.position.y = -0.01;
|
| 128 |
+
_group.add(grid);
|
| 129 |
+
_floor = grid;
|
| 130 |
+
}
|
| 131 |
+
|
| 132 |
+
// two grids of coloured cells (standard | keyless attention maps). Pre-allocate
|
| 133 |
+
// a fixed HEAT_MAX x HEAT_MAX per side; toggle visibility/color in place.
|
| 134 |
+
function _buildHeatmaps() {
|
| 135 |
+
const THREE = _THREE;
|
| 136 |
+
_heatGroup = new THREE.Group();
|
| 137 |
+
_heatGroup.position.set(0.0, 0.05, 2.6);
|
| 138 |
+
_group.add(_heatGroup);
|
| 139 |
+
const cellGeo = new THREE.PlaneGeometry(HEAT_CELL, HEAT_CELL);
|
| 140 |
+
|
| 141 |
+
function makeGrid(offsetX, arr) {
|
| 142 |
+
for (let r = 0; r < HEAT_MAX; r++) {
|
| 143 |
+
for (let c = 0; c < HEAT_MAX; c++) {
|
| 144 |
+
const mesh = new THREE.Mesh(
|
| 145 |
+
cellGeo,
|
| 146 |
+
new THREE.MeshBasicMaterial({ color: C_ZERO, transparent: true, opacity: 0.0, side: THREE.DoubleSide }),
|
| 147 |
+
);
|
| 148 |
+
mesh.rotation.x = -Math.PI / 2;
|
| 149 |
+
mesh.position.set(offsetX + c * HEAT_GAP, 0.02, r * HEAT_GAP);
|
| 150 |
+
mesh.visible = false;
|
| 151 |
+
_heatGroup.add(mesh);
|
| 152 |
+
arr.push(mesh);
|
| 153 |
+
}
|
| 154 |
+
}
|
| 155 |
+
}
|
| 156 |
+
makeGrid(0.0, _heatStd);
|
| 157 |
+
makeGrid(HEAT_MAX * HEAT_GAP + 0.8, _heatKeyless);
|
| 158 |
+
}
|
| 159 |
+
|
| 160 |
+
function _buildBars() {
|
| 161 |
+
const THREE = _THREE;
|
| 162 |
+
_barGroup = new THREE.Group();
|
| 163 |
+
_barGroup.position.set(-3.4, 0, 0.0);
|
| 164 |
+
_group.add(_barGroup);
|
| 165 |
+
const geo = new THREE.BoxGeometry(BAR_W, 1.0, BAR_W);
|
| 166 |
+
|
| 167 |
+
_barStd = new THREE.Mesh(
|
| 168 |
+
geo,
|
| 169 |
+
new THREE.MeshStandardMaterial({ color: C_STD, emissive: C_STD, emissiveIntensity: 0.35, transparent: true, opacity: 0.9 }),
|
| 170 |
+
);
|
| 171 |
+
_barStd.position.set(0, 0.5, 0);
|
| 172 |
+
_barGroup.add(_barStd);
|
| 173 |
+
|
| 174 |
+
_barKeyless = new THREE.Mesh(
|
| 175 |
+
geo,
|
| 176 |
+
new THREE.MeshStandardMaterial({ color: C_KEYLESS, emissive: C_KEYLESS, emissiveIntensity: 0.35, transparent: true, opacity: 0.9 }),
|
| 177 |
+
);
|
| 178 |
+
_barKeyless.position.set(1.3, 0.5, 0);
|
| 179 |
+
_barGroup.add(_barKeyless);
|
| 180 |
+
|
| 181 |
+
_barFid = new THREE.Mesh(
|
| 182 |
+
geo,
|
| 183 |
+
new THREE.MeshStandardMaterial({ color: C_FID, emissive: C_FID, emissiveIntensity: 0.35, transparent: true, opacity: 0.9 }),
|
| 184 |
+
);
|
| 185 |
+
_barFid.position.set(2.6, 0.5, 0);
|
| 186 |
+
_barGroup.add(_barFid);
|
| 187 |
+
}
|
| 188 |
+
|
| 189 |
+
// =============================================================================
|
| 190 |
+
// live data handler
|
| 191 |
+
// =============================================================================
|
| 192 |
+
function _onKeyless(j) {
|
| 193 |
+
// read honesty label VERBATIM — never upgrade. handle top-level 'label' OR
|
| 194 |
+
// nested 'payload.label' to match our own module's shape.
|
| 195 |
+
const lbl = (j && j.label != null) ? j.label
|
| 196 |
+
: (j && j.payload && j.payload.label != null) ? j.payload.label
|
| 197 |
+
: "MODELED";
|
| 198 |
+
const src = (j && j.payload && typeof j.payload === "object") ? j.payload : j;
|
| 199 |
+
S.label = String(lbl).toUpperCase();
|
| 200 |
+
|
| 201 |
+
S.L = typeof src.L === "number" ? src.L : null;
|
| 202 |
+
S.d = typeof src.d === "number" ? src.d : null;
|
| 203 |
+
S.m = typeof src.m === "number" ? src.m : null;
|
| 204 |
+
S.bytesPer = typeof src.bytes_per_entry === "number" ? src.bytes_per_entry : null;
|
| 205 |
+
S.kvEntStd = typeof src.kv_entries_standard === "number" ? src.kv_entries_standard : null;
|
| 206 |
+
S.kvEntKey = typeof src.kv_entries_keyless === "number" ? src.kv_entries_keyless : null;
|
| 207 |
+
S.kvBytesStd = typeof src.kv_bytes_standard === "number" ? src.kv_bytes_standard : null;
|
| 208 |
+
S.kvBytesKey = typeof src.kv_bytes_keyless === "number" ? src.kv_bytes_keyless : null;
|
| 209 |
+
S.reduction = typeof src.reduction_pct === "number" ? src.reduction_pct : null;
|
| 210 |
+
S.cosMean = typeof src.cosine_mean === "number" ? src.cosine_mean : null;
|
| 211 |
+
S.cosMin = typeof src.cosine_min === "number" ? src.cosine_min : null;
|
| 212 |
+
S.mse = typeof src.mse === "number" ? src.mse : null;
|
| 213 |
+
|
| 214 |
+
S.scoresStd = Array.isArray(src.scores_std_head) ? src.scores_std_head : null;
|
| 215 |
+
S.scoresKey = Array.isArray(src.scores_keyless_head) ? src.scores_keyless_head : null;
|
| 216 |
+
|
| 217 |
+
_updateAll();
|
| 218 |
+
_paintOverlay();
|
| 219 |
+
}
|
| 220 |
+
|
| 221 |
+
// =============================================================================
|
| 222 |
+
// geometry updaters
|
| 223 |
+
// =============================================================================
|
| 224 |
+
function _updateAll() {
|
| 225 |
+
_updateHeatmaps();
|
| 226 |
+
_updateBars();
|
| 227 |
+
}
|
| 228 |
+
|
| 229 |
+
// colour a heatmap grid from an attention map: base hue, |value| -> opacity.
|
| 230 |
+
// Near-zero -> grey.
|
| 231 |
+
function _paintHeat(arr, mat, baseColor) {
|
| 232 |
+
const live = S.state === "live";
|
| 233 |
+
const rows = (live && mat && mat.length) ? Math.min(mat.length, HEAT_MAX) : 0;
|
| 234 |
+
const cols = (live && mat && mat[0]) ? Math.min(mat[0].length, HEAT_MAX) : 0;
|
| 235 |
+
|
| 236 |
+
// find max for normalization (attention weights are in [0,1])
|
| 237 |
+
let amax = 0.0;
|
| 238 |
+
for (let r = 0; r < rows; r++) {
|
| 239 |
+
for (let c = 0; c < cols; c++) {
|
| 240 |
+
const v = Math.abs(mat[r][c]);
|
| 241 |
+
if (v > amax) amax = v;
|
| 242 |
+
}
|
| 243 |
+
}
|
| 244 |
+
if (amax <= 0.0) amax = 1.0;
|
| 245 |
+
|
| 246 |
+
for (let r = 0; r < HEAT_MAX; r++) {
|
| 247 |
+
for (let c = 0; c < HEAT_MAX; c++) {
|
| 248 |
+
const mesh = arr[r * HEAT_MAX + c];
|
| 249 |
+
if (!live || r >= rows || c >= cols) { mesh.visible = false; continue; }
|
| 250 |
+
mesh.visible = true;
|
| 251 |
+
const v = mat[r][c];
|
| 252 |
+
const mag = Math.min(1.0, Math.abs(v) / amax);
|
| 253 |
+
const color = mag < 0.04 ? C_ZERO : baseColor;
|
| 254 |
+
mesh.material.color.setHex(color);
|
| 255 |
+
mesh.material.opacity = 0.18 + 0.75 * mag;
|
| 256 |
+
}
|
| 257 |
+
}
|
| 258 |
+
}
|
| 259 |
+
|
| 260 |
+
function _updateHeatmaps() {
|
| 261 |
+
_paintHeat(_heatStd, S.scoresStd, C_STD);
|
| 262 |
+
_paintHeat(_heatKeyless, S.scoresKey, C_KEYLESS);
|
| 263 |
+
}
|
| 264 |
+
|
| 265 |
+
// cache-size bars: height ∝ entry count (standard is exactly 2× keyless), so
|
| 266 |
+
// the 50% shrink is visible directly. Fidelity bar: height ∝ cosine_mean.
|
| 267 |
+
function _updateBars() {
|
| 268 |
+
const live = S.state === "live";
|
| 269 |
+
|
| 270 |
+
function setCacheBar(mesh, entries, refMax, color) {
|
| 271 |
+
if (!mesh) return;
|
| 272 |
+
if (!live || entries == null) {
|
| 273 |
+
mesh.material.color.setHex(C_DIM);
|
| 274 |
+
mesh.material.emissive.setHex(C_DIM);
|
| 275 |
+
mesh.material.opacity = 0.3;
|
| 276 |
+
mesh.scale.y = 0.05;
|
| 277 |
+
mesh.position.y = 0.025;
|
| 278 |
+
return;
|
| 279 |
+
}
|
| 280 |
+
const h = Math.max(0.08, (entries / (refMax || 1)) * 3.0);
|
| 281 |
+
mesh.scale.y = h;
|
| 282 |
+
mesh.position.y = h * 0.5;
|
| 283 |
+
mesh.material.color.setHex(color);
|
| 284 |
+
mesh.material.emissive.setHex(color);
|
| 285 |
+
mesh.material.emissiveIntensity = 0.4;
|
| 286 |
+
mesh.material.opacity = 0.92;
|
| 287 |
+
}
|
| 288 |
+
|
| 289 |
+
const refMax = (S.kvEntStd != null && S.kvEntStd > 0) ? S.kvEntStd : 1;
|
| 290 |
+
setCacheBar(_barStd, S.kvEntStd, refMax, C_STD);
|
| 291 |
+
setCacheBar(_barKeyless, S.kvEntKey, refMax, C_KEYLESS);
|
| 292 |
+
|
| 293 |
+
// fidelity bar — cosine_mean mapped from [-1,1] to a positive height
|
| 294 |
+
if (_barFid) {
|
| 295 |
+
if (!live || S.cosMean == null) {
|
| 296 |
+
_barFid.material.color.setHex(C_DIM);
|
| 297 |
+
_barFid.material.emissive.setHex(C_DIM);
|
| 298 |
+
_barFid.material.opacity = 0.3;
|
| 299 |
+
_barFid.scale.y = 0.05;
|
| 300 |
+
_barFid.position.y = 0.025;
|
| 301 |
+
} else {
|
| 302 |
+
const h = Math.max(0.08, ((S.cosMean + 1.0) / 2.0) * 3.0);
|
| 303 |
+
_barFid.scale.y = h;
|
| 304 |
+
_barFid.position.y = h * 0.5;
|
| 305 |
+
_barFid.material.color.setHex(C_FID);
|
| 306 |
+
_barFid.material.emissive.setHex(C_FID);
|
| 307 |
+
_barFid.material.emissiveIntensity = 0.4;
|
| 308 |
+
_barFid.material.opacity = 0.92;
|
| 309 |
+
}
|
| 310 |
+
}
|
| 311 |
+
}
|
| 312 |
+
|
| 313 |
+
// =============================================================================
|
| 314 |
+
// per-frame animation
|
| 315 |
+
// =============================================================================
|
| 316 |
+
function _onFrame() {
|
| 317 |
+
const t = performance.now();
|
| 318 |
+
if (_group) _group.rotation.y = Math.sin(t * 0.00008) * 0.12;
|
| 319 |
+
}
|
| 320 |
+
|
| 321 |
+
// =============================================================================
|
| 322 |
+
// overlay
|
| 323 |
+
// =============================================================================
|
| 324 |
+
function _buildOverlay() {
|
| 325 |
+
const ctx = _ctx;
|
| 326 |
+
_overlay = document.createElement("div");
|
| 327 |
+
Object.assign(_overlay.style, {
|
| 328 |
+
position: "absolute", left: "14px", top: "14px", zIndex: "6",
|
| 329 |
+
display: "flex", flexDirection: "column", gap: "8px",
|
| 330 |
+
maxWidth: "min(94%,470px)",
|
| 331 |
+
font: "12px ui-sans-serif,system-ui,Segoe UI,Roboto,Arial",
|
| 332 |
+
color: "#eef3f6",
|
| 333 |
+
});
|
| 334 |
+
|
| 335 |
+
const h = document.createElement("div");
|
| 336 |
+
h.style.cssText = "font:600 13px ui-sans-serif,system-ui;letter-spacing:.4px";
|
| 337 |
+
h.textContent = TITLE;
|
| 338 |
+
_overlay.appendChild(h);
|
| 339 |
+
|
| 340 |
+
const sub = document.createElement("div");
|
| 341 |
+
sub.style.cssText = "color:#9fb1bf;font-size:11px;line-height:1.55";
|
| 342 |
+
sub.innerHTML =
|
| 343 |
+
'Keyless Attention <b>eliminates the key projection</b> entirely: a value-space <b>routing matrix R</b> ' +
|
| 344 |
+
'replaces W<sub>k</sub>, so logits are formed as softmax((Q\u00b7R)\u00b7V\u1d40/\u221ad) and the decode ' +
|
| 345 |
+
'cache stores <b>values only</b>. Standard QKV attention caches both K and V (2\u00b7L\u00b7d); keyless caches ' +
|
| 346 |
+
'V alone (L\u00b7d) \u2014 an <b>exactly 50%</b> reduction. Panels: cache-size bars (standard vs keyless), ' +
|
| 347 |
+
'attention-map heatmaps (standard vs keyless), and an output-fidelity bar (mean per-token cosine similarity ' +
|
| 348 |
+
'between the two outputs). Honesty label <b>MODELED</b> (deterministic mechanism reproduction on a toy ' +
|
| 349 |
+
'sequence; trains nothing). 0 runtime CDN.';
|
| 350 |
+
_overlay.appendChild(sub);
|
| 351 |
+
|
| 352 |
+
const brow = document.createElement("div");
|
| 353 |
+
brow.style.cssText = "display:flex;gap:8px;align-items:center;flex-wrap:wrap";
|
| 354 |
+
if (_badge && _badge.el) brow.appendChild(_badge.el);
|
| 355 |
+
_overlay.appendChild(brow);
|
| 356 |
+
|
| 357 |
+
const card = document.createElement("div");
|
| 358 |
+
card.style.cssText = "background:#0a1117;border:1px solid #1d2a36;border-radius:9px;padding:9px 10px;display:flex;flex-direction:column;gap:6px";
|
| 359 |
+
|
| 360 |
+
const chead = document.createElement("div");
|
| 361 |
+
chead.style.cssText = "display:flex;align-items:center;gap:8px;flex-wrap:wrap";
|
| 362 |
+
const dot = document.createElement("span");
|
| 363 |
+
dot.style.cssText = "width:9px;height:9px;border-radius:50%;background:#3af4c8;box-shadow:0 0 7px #3af4c8";
|
| 364 |
+
const nm = document.createElement("b");
|
| 365 |
+
nm.style.cssText = "font-size:12px;color:#3af4c8;letter-spacing:.3px";
|
| 366 |
+
nm.textContent = "keyless attention \u00b7 value-only cache";
|
| 367 |
+
chead.appendChild(dot); chead.appendChild(nm);
|
| 368 |
+
card.appendChild(chead);
|
| 369 |
+
|
| 370 |
+
const grid = document.createElement("div");
|
| 371 |
+
grid.style.cssText = "display:grid;grid-template-columns:1fr;gap:4px";
|
| 372 |
+
|
| 373 |
+
function kpiRow(id, label) {
|
| 374 |
+
const r = document.createElement("div");
|
| 375 |
+
r.style.cssText = "display:flex;justify-content:space-between;gap:10px;font-size:11px";
|
| 376 |
+
const l = document.createElement("span"); l.style.cssText = "color:#9fb1bf"; l.textContent = label;
|
| 377 |
+
const v = document.createElement("b");
|
| 378 |
+
v.id = id;
|
| 379 |
+
v.style.cssText = "font-variant-numeric:tabular-nums;color:#eef3f6;text-align:right;max-width:56%";
|
| 380 |
+
v.textContent = "\u2014";
|
| 381 |
+
_el[id] = v;
|
| 382 |
+
r.appendChild(l); r.appendChild(v); return r;
|
| 383 |
+
}
|
| 384 |
+
|
| 385 |
+
grid.appendChild(kpiRow("kl-dims", "sequence (L \u00d7 d)"));
|
| 386 |
+
grid.appendChild(kpiRow("kl-m", "factorization depth m"));
|
| 387 |
+
grid.appendChild(kpiRow("kl-entstd", "cache entries \u2014 STANDARD (K+V)"));
|
| 388 |
+
grid.appendChild(kpiRow("kl-entkey", "cache entries \u2014 KEYLESS (V-only)"));
|
| 389 |
+
grid.appendChild(kpiRow("kl-bytestd", "cache bytes \u2014 STANDARD"));
|
| 390 |
+
grid.appendChild(kpiRow("kl-bytekey", "cache bytes \u2014 KEYLESS"));
|
| 391 |
+
grid.appendChild(kpiRow("kl-reduction","KV-cache reduction"));
|
| 392 |
+
grid.appendChild(kpiRow("kl-cosmean", "output fidelity \u2014 mean cosine (MEASURED)"));
|
| 393 |
+
grid.appendChild(kpiRow("kl-cosmin", "output fidelity \u2014 min cosine"));
|
| 394 |
+
grid.appendChild(kpiRow("kl-mse", "output MSE (standard vs keyless)"));
|
| 395 |
+
grid.appendChild(kpiRow("kl-label", "honesty label"));
|
| 396 |
+
card.appendChild(grid);
|
| 397 |
+
|
| 398 |
+
const fn = document.createElement("div");
|
| 399 |
+
fn.style.cssText = "font-size:9.5px;color:#6b7a86;line-height:1.5";
|
| 400 |
+
fn.textContent = "Keyless Attention \u2014 Xin Gao, \u201cValue-Space Routing and Value-Only Caching for Efficient Transformers\u201d arXiv:2606.21848 (arxiv.org/abs/2606.21848). MODELED \u00b7 mechanism demo on a toy sequence, not a trained transformer.";
|
| 401 |
+
card.appendChild(fn);
|
| 402 |
+
_overlay.appendChild(card);
|
| 403 |
+
|
| 404 |
+
const pl = document.createElement("button");
|
| 405 |
+
pl.textContent = "\u25d1 what this means";
|
| 406 |
+
pl.title = "Toggle plain-language explanation for investors & consumers.";
|
| 407 |
+
pl.style.cssText = "font:11px ui-monospace,monospace;padding:5px 11px;border-radius:7px;border:1px solid #3af4c8;background:#08140f;color:#3af4c8;cursor:pointer;width:fit-content";
|
| 408 |
+
pl.addEventListener("click", () => {
|
| 409 |
+
_plain = !_plain;
|
| 410 |
+
pl.style.background = _plain ? "#0f2a20" : "#08140f";
|
| 411 |
+
_applyPlain();
|
| 412 |
+
});
|
| 413 |
+
_overlay.appendChild(pl);
|
| 414 |
+
|
| 415 |
+
const pd = document.createElement("div");
|
| 416 |
+
pd.id = "kl-plain";
|
| 417 |
+
pd.style.cssText = "font-size:10.5px;color:#c9d6df;line-height:1.55;border:1px dashed #26333f;border-radius:7px;padding:7px 9px;display:none";
|
| 418 |
+
_el["plain"] = pd;
|
| 419 |
+
_overlay.appendChild(pd);
|
| 420 |
+
|
| 421 |
+
(ctx.container || document.body).appendChild(_overlay);
|
| 422 |
+
_paintOverlay();
|
| 423 |
+
}
|
| 424 |
+
|
| 425 |
+
function _applyPlain() {
|
| 426 |
+
const pd = _el["plain"];
|
| 427 |
+
if (!pd) return;
|
| 428 |
+
pd.style.display = _plain ? "block" : "none";
|
| 429 |
+
if (!_plain) return;
|
| 430 |
+
const red = S.reduction != null ? S.reduction.toFixed(1) + "%" : "loading\u2026";
|
| 431 |
+
const cos = S.cosMean != null ? S.cosMean.toFixed(3) : "loading\u2026";
|
| 432 |
+
const bs = S.kvBytesStd != null ? S.kvBytesStd + " B" : "loading\u2026";
|
| 433 |
+
const bk = S.kvBytesKey != null ? S.kvBytesKey + " B" : "loading\u2026";
|
| 434 |
+
pd.innerHTML =
|
| 435 |
+
"<b>What this means:</b> To generate text fast, a model keeps a running memory of every earlier word \u2014 " +
|
| 436 |
+
"the \u201cKV cache.\u201d Normally it stores two things per word (a <b>key</b> and a <b>value</b>). Keyless " +
|
| 437 |
+
"Attention throws away the key entirely and reroutes the lookup through the values themselves, so it only " +
|
| 438 |
+
"stores <b>one</b> thing per word. That halves the memory: here from about <b>" + bs + "</b> down to <b>" +
|
| 439 |
+
bk + "</b> \u2014 a <b>" + red + "</b> cut. On this small synthetic test the two methods produce outputs " +
|
| 440 |
+
"that overlap with an average cosine similarity of about <b>" + cos + "</b>. This view is a <b>MODELED</b> " +
|
| 441 |
+
"deterministic reproduction of that cache-halving MECHANISM on a tiny synthetic sequence \u2014 it <b>trains " +
|
| 442 |
+
"no model</b> and runs no GPU kernel. The paper\u2019s headline that keyless matches or beats standard " +
|
| 443 |
+
"attention on <b>real</b> models (GPT-2, Pythia, Qwen2, Llama 3.2) is a <b>claim about real training runs</b> " +
|
| 444 |
+
"the estate does not independently verify.";
|
| 445 |
+
}
|
| 446 |
+
|
| 447 |
+
function _tok(s) {
|
| 448 |
+
if (s === "live") return null;
|
| 449 |
+
if (s === "missing") return "NO-LIVE-DATA";
|
| 450 |
+
if (s === "degraded") return "DEGRADED";
|
| 451 |
+
if (s === "error") return "OFFLINE";
|
| 452 |
+
return "\u2026";
|
| 453 |
+
}
|
| 454 |
+
|
| 455 |
+
function fx(v, d) { return typeof v === "number" ? v.toFixed(d) : "\u2014"; }
|
| 456 |
+
function _set(id, v) { if (_el[id]) _el[id].textContent = v; }
|
| 457 |
+
|
| 458 |
+
function _paintOverlay() {
|
| 459 |
+
const t = _tok(S.state);
|
| 460 |
+
_set("kl-dims", t || ((S.L != null && S.d != null) ? (S.L + " \u00d7 " + S.d) : "\u2014"));
|
| 461 |
+
_set("kl-m", t || (S.m != null ? String(S.m) : "\u2014"));
|
| 462 |
+
_set("kl-entstd", t || (S.kvEntStd != null ? String(S.kvEntStd) : "\u2014"));
|
| 463 |
+
_set("kl-entkey", t || (S.kvEntKey != null ? String(S.kvEntKey) : "\u2014"));
|
| 464 |
+
_set("kl-bytestd", t || (S.kvBytesStd != null ? (S.kvBytesStd + " B") : "\u2014"));
|
| 465 |
+
_set("kl-bytekey", t || (S.kvBytesKey != null ? (S.kvBytesKey + " B") : "\u2014"));
|
| 466 |
+
_set("kl-reduction", t || (S.reduction != null ? (S.reduction.toFixed(1) + "%") : "\u2014"));
|
| 467 |
+
_set("kl-cosmean", t || fx(S.cosMean, 4));
|
| 468 |
+
_set("kl-cosmin", t || fx(S.cosMin, 4));
|
| 469 |
+
_set("kl-mse", t || fx(S.mse, 4));
|
| 470 |
+
// honesty label verbatim — never upgraded
|
| 471 |
+
_set("kl-label", t || (S.label || "MODELED"));
|
| 472 |
+
if (_plain) _applyPlain();
|
| 473 |
+
}
|
| 474 |
+
|
| 475 |
+
// =============================================================================
|
| 476 |
+
// unmount — clean up everything; must not affect other organs
|
| 477 |
+
// =============================================================================
|
| 478 |
+
export function unmount() {
|
| 479 |
+
_polls.forEach((p) => { try { p.stop(); } catch (_) {} }); _polls = [];
|
| 480 |
+
try { if (_overlay && _overlay.parentNode) _overlay.parentNode.removeChild(_overlay); } catch (_) {}
|
| 481 |
+
try {
|
| 482 |
+
if (_group && _stage) {
|
| 483 |
+
_group.traverse((o) => {
|
| 484 |
+
if (o.geometry && o.geometry.dispose) o.geometry.dispose();
|
| 485 |
+
if (o.material) {
|
| 486 |
+
const ms = Array.isArray(o.material) ? o.material : [o.material];
|
| 487 |
+
ms.forEach((m) => { if (m.dispose) m.dispose(); });
|
| 488 |
+
}
|
| 489 |
+
});
|
| 490 |
+
_stage.scene.remove(_group);
|
| 491 |
+
}
|
| 492 |
+
} catch (_) {}
|
| 493 |
+
_group = _overlay = null;
|
| 494 |
+
_floor = null;
|
| 495 |
+
_heatStd = []; _heatKeyless = []; _heatGroup = null;
|
| 496 |
+
_barStd = null; _barKeyless = null; _barFid = null; _barGroup = null;
|
| 497 |
+
_el = {}; _badge = null; _plain = false; _frameReg = false;
|
| 498 |
+
_stage = _THREE = _ctx = null;
|
| 499 |
+
S.label = S.L = S.d = S.m = null;
|
| 500 |
+
S.bytesPer = S.kvEntStd = S.kvEntKey = S.kvBytesStd = S.kvBytesKey = null;
|
| 501 |
+
S.reduction = S.cosMean = S.cosMin = S.mse = null;
|
| 502 |
+
S.scoresStd = S.scoresKey = null;
|
| 503 |
+
S.state = "init";
|
| 504 |
+
}
|
| 505 |
+
|
| 506 |
+
export default { id: ID, title: TITLE, endpoints: [EP], mount, unmount };
|