An HP lattice protein folds a hydrophobic core under replica-exchange Monte Carlo.
In Dill's HP model a protein is a chain of hydrophobic (orange) and polar (white) beads on a square or cubic lattice, and every pair of touching hydrophobic beads that are not bonded lowers the energy by one, drawn as red dashes. Eight copies of the chain run Metropolis Monte Carlo with pull moves, where a bead steps to a free diagonal site and the chain follows behind it, on a ladder of temperatures from 0.24 to 1.25; neighbors on the ladder regularly swap conformations, so a fold stuck in the cold can melt in the heat and come back down somewhere better. The panel shows every replica and flashes each accepted swap, while the main view follows the best current replica, aligned by lattice symmetry so a swap morphs smoothly. It starts on the classic 2D benchmark sequences and usually reaches their best known energies, such as -23 for the 48-residue S1-5, within seconds.
Try it. Drag a bead to pull the chain apart, and every replica refolds from your version. Type H and P letters and press Enter to fold your own sequence. Buttons or keys step through the benchmarks (N or the arrows), switch between 2D and 3D (D), unfold (U), change speed (up and down arrows) and pause (Space). In 3D, drag to turn the lattice.
Paste this into Claude Code, Codex or any coding agent to get a simple version running, then take it wherever you like.
Build an HP lattice protein folding simulator with JavaScript and the HTML canvas element. Put everything in a single index.html file with no libraries or build step, so I can open it directly in a browser.
Start simple:
- Make a canvas that fills the window, stays sharp on high-DPI screens (scale by devicePixelRatio), and draws a light graph paper grid.
- Represent a protein as a string of H (hydrophobic) and P (polar) letters, for example PPHPPHHPPHHPPPPPHHHHHHHHHHPPPPPPHHPPHHPPHPPHHHHH, placed as a chain of beads on the square lattice, starting as a straight line. Keep a map from lattice cell to bead so you can check that the chain never overlaps itself.
- The energy is -1 for every pair of H beads that touch on the lattice but are not neighbors along the chain.
- Each frame, run a few hundred Monte Carlo moves at a fixed temperature: pick a bead, try an end move (an end bead jumps to a free cell next to its neighbor) or a corner flip (a bead at a corner flips to the opposite corner of the square), and accept with the Metropolis rule, keeping it if the energy drops or with probability exp(-increase / T).
- Draw bonds as thick lines, H beads in orange, P beads in white, and H to H contacts as red dashed lines.
Once that works, make it beautiful:
- Add pull moves, where a bead steps to a free diagonal cell and the chain follows behind it, which let it fold much faster.
- Run several copies at a ladder of temperatures and let neighbors swap temperatures now and then (replica exchange), accepting a swap with probability exp((1/T1 - 1/T2)(E1 - E2)).
- Smoothly animate beads between lattice positions, zoom to fit the chain, and chart the energy over time.
Explain the key ideas in short code comments. When you're done, tell me how to open it and suggest three directions I could take it next, such as a 3D cubic lattice, typing in your own sequence, or dragging a bead to pull the chain apart.
