HomeComputer ScienceFill-in-the-Middle: AI Code Infilling Simulator

Fill-in-the-Middle: AI Code Infilling Simulator

Watch an AI code model reconstruct a missing chunk of code token by token using the Fill-in-the-Middle (FIM) training format, with adjustable sampling temperature and PSM/SPM reordering to see how hallucinated tokens emerge.

Computer Science3DModerate60 FPS📱 Mobile-adapted⇄ 2D version
ai-topic-76 ↗ Open standalone

Modern code-completion models — GitHub Copilot, Cursor AI, Code Llama, StarCoder — don't just extend code forward from your cursor; they can also fill a gap you've left in the middle of a function, because they were trained on the Fill-in-the-Middle (FIM) objective. This simulator renders that mechanism directly: a real short function is split into a prefix, a missing middle "hole", and a suffix. The top row of blocks shows the code exactly as you'd read it; the bottom row shows the reordered token sequence — prefix/suffix wrapped in special <PRE>/<SUF>/<MID> markers — that the model actually consumes and generates from, autoregressively, one token at a time. A temperature-scaled softmax samples each middle token from a small candidate distribution, so cranking the temperature up visibly increases how often the model diverges from the ground-truth token — a live, mechanistic view of why AI code completion is sometimes confidently wrong.

⚙ Under the hood

Watch an AI code model reconstruct a missing chunk of code token by token using the Fill-in-the-Middle (FIM) training format, with adjustable sampling temperature and PSM/SPM reordering to see how hallucinated tokens emerge.

ai code generationfill-in-the-middlellmcode completionsoftmaxcopilot

3D · Three.js / WebGL renderer · 60 FPS target · runs fully client-side, no install

What did you find?

Add reproduction steps (optional)