// machine learning, in the browser
Six small ML demos, each with the maths behind it
Every demo runs entirely client-side: the retrieval, the attention weights, the optimiser steps and the clustering are computed in JavaScript as you interact. Each one has its own page with the demo on the left and the theory on the right.
RAG document Q&A
Type a question, watch TF-IDF retrieval rank a small knowledge base by cosine similarity, and see an answer grounded in the top passages.
Open the demo → 02 / Transformer self-attentionAttention visualizer
Type a sentence and see the Q·Kᵀ scores turn into a softmax heatmap, with a causal mask and a temperature control.
Open the demo → 03 / Parameter-efficient fine-tuningLoRA calculator
Pick a model and a rank and see how many parameters LoRA trains and how much GPU memory full fine-tuning, LoRA and QLoRA need.
Open the demo → 04 / Optimisers on a loss surfaceGradient descent playground
SGD, momentum and Adam race across a non-convex loss surface while you change the learning rate.
Open the demo → 05 / Unsupervised segmentationK-means clustering
Click to add points or generate blobs, choose k, and step through Lloyd's algorithm with k-means++ initialisation.
Open the demo → 06 / A classifier from scratchNaive Bayes sentiment
A log-odds lexicon classifier with negation handling: every word becomes a chip that shows how it pushed the verdict.
Open the demo →How it is built
- Plain HTML, CSS and JavaScript, no framework and no build step for the demos themselves; the pages are generated from one template by a small Python script.
- Each demo is one self-contained module in
js/demos/that draws into its page and returns a cleanup function. - Formulas are typeset with a self-hosted copy of KaTeX; fonts are self-hosted too, so no request leaves the page.
- Light and dark theme, keyboard focus styles and reduced-motion support shared with my portfolio.