flow-pocket-lab / index.html
ARotting's picture
Publish Interactive temperature-controlled RealNVP sampler
a193678 verified
Raw History Blame Contribute Delete
12.5 kB
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>Flow Pocket Lab</title>
<style>
:root { color-scheme: dark; font-family: Inter, ui-sans-serif, system-ui; }
* { box-sizing: border-box; }
body { margin: 0; min-height: 100vh; background: #060817; color: #edf4ff; }
canvas { position: fixed; inset: 0; width: 100%; height: 100%; opacity: .55; }
main { position: relative; z-index: 1; width: min(1080px, 92vw); margin: auto;
padding: 72px 0 96px; }
.eyebrow { color: #73e6ff; letter-spacing: .18em; text-transform: uppercase;
font-size: .75rem; font-weight: 800; }
h1 { font-size: clamp(3rem, 8vw, 7rem); line-height: .9; margin: 14px 0 24px;
background: linear-gradient(120deg,#fff,#74e7ff 55%,#b48cff);
-webkit-background-clip: text; color: transparent; }
.lead { max-width: 760px; color: #b8c7e6; font-size: 1.2rem; line-height: 1.65; }
.actions { display: flex; flex-wrap: wrap; gap: 12px; margin: 30px 0 48px; }
a { color: inherit; }
.button { padding: 12px 18px; border-radius: 999px; text-decoration: none;
background: #eaf8ff; color: #07101c; font-weight: 800; }
.button.alt { background: #171d38cc; color: #dce8ff; border: 1px solid #415078; }
.grid { display: grid; grid-template-columns: 1.1fr .9fr; gap: 20px; }
.card { border: 1px solid #344269; background: #0c1128dd; border-radius: 24px;
padding: 24px; backdrop-filter: blur(18px); box-shadow: 0 24px 80px #0008; }
h2 { margin-top: 0; }
pre { white-space: pre-wrap; word-break: break-word; color: #a9bddf;
max-height: 520px; overflow: auto; }
ul { max-height: 520px; overflow: auto; padding-left: 1.2rem; color: #a9bddf; }
li { margin: 8px 0; }
input { width: 100%; padding: 12px; border-radius: 12px; border: 1px solid #344269;
background: #070b1a; color: white; margin-bottom: 12px; }
@media (max-width: 780px) { .grid { grid-template-columns: 1fr; } }
</style>
</head>
<body>
<canvas id="field"></canvas>
<main>
<div class="eyebrow">Jacob Garcia · Hugging Face Model Foundry</div>
<h1>Flow Pocket Lab</h1>
<p class="lead">Interactive temperature-controlled RealNVP sampler. This showcase backs up the
trained artifacts, measured evaluation, and complete runnable source.</p>
<div class="actions">
<a class="button" href="https://huggingface.co/spaces/ARotting/flow-pocket-lab/tree/main">Explore every file</a>
<a class="button alt" href="https://huggingface.co/ARotting">View the full foundry</a>
</div>
<div class="grid">
<section class="card">
<h2>Verified project card</h2>
<pre># Flow Pocket
Flow Pocket trains an exactly invertible RealNVP density model on a curved
five-armed pinwheel distribution. Eight affine coupling layers transform data into
a standard Gaussian while tracking the exact change-of-variables log determinant.
The benchmark compares held-out negative log-likelihood and generated-sample MMD
against a fitted full-covariance Gaussian and a five-component Gaussian mixture.
It also measures forward/inverse cycle error to verify that the saved neural
transform is numerically invertible.
## Verified results
The flow trained on 40,000 samples and was evaluated on 10,000 independently
generated samples.
| Model | Held-out NLL | Sample MMD |
| --- | ---: | ---: |
| RealNVP | 2.2629 | 0.000236 |
| Five-component GMM | 2.5887 | 0.000436 |
| Full-covariance Gaussian | 3.3527 | 0.002800 |
The eight-coupling-layer RealNVP has 21,536 parameters. Its maximum absolute
forward/inverse reconstruction error over 2,000 held-out points was `5.78e-6`.
MMD uses independently randomized 1,000-sample subsets and a shared median
distance bandwidth.
## Reproduce
```powershell
uv run python projects/flow-pocket/train.py
```
</pre>
<h2>Evaluation snapshot</h2>
<pre>{
&quot;benchmark&quot;: &quot;Five-arm pinwheel density estimation&quot;,
&quot;training_examples&quot;: 40000,
&quot;heldout_examples&quot;: 10000,
&quot;results&quot;: {
&quot;realnvp&quot;: {
&quot;parameters&quot;: 21536,
&quot;test_nll&quot;: 2.2628610134124756,
&quot;sample_mmd&quot;: 0.00023621320724487305,
&quot;maximum_cycle_error&quot;: 5.781650543212891e-06
},
&quot;full_covariance_gaussian&quot;: {
&quot;test_nll&quot;: 3.352746780780259,
&quot;sample_mmd&quot;: 0.002799742898649704
},
&quot;five_component_gmm&quot;: {
&quot;test_nll&quot;: 2.5887062549591064,
&quot;sample_mmd&quot;: 0.00043558339810489954
}
},
&quot;training_history&quot;: [
{
&quot;training_step&quot;: 100,
&quot;training_nll&quot;: 2.974477767944336,
&quot;validation_nll&quot;: 3.012097120285034
},
{
&quot;training_step&quot;: 200,
&quot;training_nll&quot;: 2.768125295639038,
&quot;validation_nll&quot;: 2.759519100189209
},
{
&quot;training_step&quot;: 300,
&quot;training_nll&quot;: 2.7486166954040527,
&quot;validation_nll&quot;: 2.6988091468811035
},
{
&quot;training_step&quot;: 400,
&quot;training_nll&quot;: 2.6729800701141357,
&quot;validation_nll&quot;: 2.6116697788238525
},
{
&quot;training_step&quot;: 500,
&quot;training_nll&quot;: 2.523287534713745,
&quot;validation_nll&quot;: 2.579714298248291
},
{
&quot;training_step&quot;: 600,
&quot;training_nll&quot;: 2.5287487506866455,
&quot;validation_nll&quot;: 2.553705930709839
},
{
&quot;training_step&quot;: 700,
&quot;training_nll&quot;: 2.5176467895507812,
&quot;validation_nll&quot;: 2.56897234916687
},
{
&quot;training_step&quot;: 800,
&quot;training_nll&quot;: 2.5820188522338867,
&quot;validation_nll&quot;: 2.540039539337158
},
{
&quot;training_step&quot;: 900,
&quot;training_nll&quot;: 2.5383265018463135,
&quot;validation_nll&quot;: 2.5277373790740967
},
{
&quot;training_step&quot;: 1000,
&quot;training_nll&quot;: 2.48282527923584,
&quot;validation_nll&quot;: 2.535404682159424
},
{
&quot;training_step&quot;: 1100,
&quot;training_nll&quot;: 2.428791046142578,
&quot;validation_nll&quot;: 2.5110583305358887
},
{
&quot;training_step&quot;: 1200,
&quot;training_nll&quot;: 2.5302720069885254,
&quot;validation_nll&quot;: 2.50561261177063
},
{
&quot;training_step&quot;: 1300,
&quot;training_nll&quot;: 2.3884363174438477,
&quot;validation_nll&quot;: 2.4981091022491455
},
{
&quot;training_step&quot;: 1400,
&quot;training_nll&quot;: 2.4792046546936035,
&quot;validation_nll&quot;: 2.491697311401367
},
{
&quot;training_step&quot;: 1500,
&quot;training_nll&quot;: 2.419118881225586,
&quot;validation_nll&quot;: 2.463804244995117
},
{
&quot;training_step&quot;: 1600,
&quot;training_nll&quot;: 2.4760823249816895,
&quot;validation_nll&quot;: 2.4544918537139893
},
{
&quot;training_step&quot;: 1700,
&quot;training_nll&quot;: 2.3438639640808105,
&quot;validation_nll&quot;: 2.4196836948394775
},
{
&quot;training_step&quot;: 1800,
&quot;training_nll&quot;: 2.284365653991699,
&quot;validation_nll&quot;: 2.4094793796539307
},
{
&quot;training_step&quot;: 1900,
&quot;training_nll&quot;: 2.41039776802063,
&quot;validation_nll&quot;: 2.386476516723633
},
{
&quot;training_step&quot;: 2000,
&quot;training_nll&quot;: 2.343876361846924,
&quot;validation_nll&quot;: 2.371260166168213
},
{
&quot;training_step&quot;: 2100,
&quot;training_nll&quot;: 2.3377065658569336,
&quot;validation_nll&quot;: 2.371122121810913
},
{
&quot;training_step&quot;: 2200,
&quot;training_nll&quot;: 2.3578639030456543,
&quot;validation_nll&quot;: 2.3843414783477783
},
{
&quot;training_step&quot;: 2300,
&quot;training_nll&quot;: 2.361250400543213,
&quot;validation_nll&quot;: 2.374619960784912
},
{
&quot;training_step&quot;: 2400,
&quot;training_nll&quot;: 2.317490339279175,
&quot;validation_nll&quot;: 2.3640923500061035
},
{
&quot;training_step&quot;: 2500,
&quot;training_nll&quot;: 2.31643009185791,
&quot;validation_nll&quot;: 2.368194818496704
},
{
&quot;training_step&quot;: 2600,
&quot;training_nll&quot;: 2.295240640640259,
&quot;validation_nll&quot;: 2.3607025146484375
},
{
&quot;training_step&quot;: 2700,
&quot;training_nll&quot;: 2.38124942779541,
&quot;validation_nll&quot;: 2.3652212619781494
},
{
&quot;training_step&quot;: 2800,
&quot;training_nll&quot;: 2.3277204036712646,
&quot;validation_nll&quot;: 2.375239372253418
},
{
&quot;training_step&quot;: 2900,
&quot;training_nll&quot;: 2.340425491333008,
&quot;validation_nll&quot;: 2.3583223819732666
},
{
&quot;training_step&quot;: 3000,
&quot;training_nll&quot;: 2.306485176086426,
&quot;validation_nll&quot;: 2.3473105430603027
},
{
&quot;training_step&quot;: 3100,
&quot;training_nll&quot;: 2.2540557384490967,
&quot;validation_nll&quot;: 2.361114978790283
},
{
&quot;training_step&quot;: 3200,
&quot;training_nll&quot;: 2.2472634315490723,
&quot;validation_nll&quot;: 2.3361361026763916
},
{
&quot;training_step&quot;: 3300,
&quot;training_nll&quot;: 2.2850630283355713,
&quot;validation_nll&quot;: 2.3237645626068115
},
{
&quot;training_step&quot;: 3400,
&quot;training_nll&quot;: 2.372798442840576,
&quot;validation_nll&quot;: 2.346468448638916
},
{
&quot;training_step&quot;: 3500,
&quot;training_nll&quot;: 2.311044216156006,
&quot;validation_nll&quot;: 2.32955002784729
},
{
&quot;training_step&quot;: 3600,
&quot;training_nll&quot;: 2.2257301807403564,
&quot;validation_nll&quot;: 2.319716453552246
},
{
&quot;training_step&quot;: 3700,
&quot;training_nll&quot;: 2.2926011085510254,
&quot;validation_nll&quot;: 2.323981285095215
},
{
&quot;training_step&quot;: 3800,
&quot;training_nll&quot;: 2.2168548107147217,
&quot;validation_nll&quot;: 2.305316925048828
},
{
&quot;training_step&quot;: 3900,
&quot;training_nll&quot;: 2.2342185974121094,
&quot;validation_nll&quot;: 2.3181967735290527
},
{
&quot;training_step&quot;: 4000,
&quot;training_nll&quot;: 2.3150432109832764,
&quot;validation_nll&quot;: 2.279649257659912
}
]
}</pre>
</section>
<section class="card">
<h2>Backed-up artifact tree</h2>
<input id="filter" placeholder="Filter files…" autocomplete="off">
<ul id="files"><li><code>README.md</code></li>
<li><code>__pycache__/app.cpython-311.pyc</code></li>
<li><code>__pycache__/data.cpython-311.pyc</code></li>
<li><code>__pycache__/model.cpython-311.pyc</code></li>
<li><code>app.py</code></li>
<li><code>artifacts/flow-pocket/classical_controls.joblib</code></li>
<li><code>artifacts/flow-pocket/evaluation.json</code></li>
<li><code>artifacts/flow-pocket/generated_samples.npz</code></li>
<li><code>artifacts/flow-pocket/realnvp.safetensors</code></li>
<li><code>data.py</code></li>
<li><code>data/pinwheel_test.parquet</code></li>
<li><code>model.py</code></li>
<li><code>requirements.txt</code></li>
<li><code>train.py</code></li></ul>
</section>
</div>
</main>
<script>
const canvas=document.querySelector('#field'),ctx=canvas.getContext('2d');
let dots=[];
function resize(){canvas.width=innerWidth;canvas.height=innerHeight;
dots=Array.from({length:90},()=>({x:Math.random()*innerWidth,
y:Math.random()*innerHeight,vx:(Math.random()-.5)*.35,vy:(Math.random()-.5)*.35}));}
function draw(){ctx.clearRect(0,0,canvas.width,canvas.height);
for(const d of dots){d.x=(d.x+d.vx+innerWidth)%innerWidth;
d.y=(d.y+d.vy+innerHeight)%innerHeight;ctx.fillStyle='#65dcff99';
ctx.beginPath();ctx.arc(d.x,d.y,1.4,0,7);ctx.fill();}requestAnimationFrame(draw);}
addEventListener('resize',resize);resize();draw();
document.querySelector('#filter').addEventListener('input',e=>{
const q=e.target.value.toLowerCase();for(const li of document.querySelectorAll('li'))
li.hidden=!li.textContent.toLowerCase().includes(q);});
</script>
</body>
</html>