2026
This Website: Redesign 2026 React · TypeScript · Vite · Embeddings · Model2Vec · Hybrid Search · BM25 · Physics Simulation · View Transitions
The redesign of this site: one page in English and German that runs entirely in your browser, with a multilingual semantic search on a model shrunk from 512 MB to 5 MB, a handful of small physics simulations to play with and a few easter eggs for the curious.
The 2020 version of this site was a React template that had aged. The redesign keeps React, now with TypeScript and Vite, and is pre-rendered into static pages in English and German, one per project too, so it loads fast and reads well for search engines. There is no backend and no request to third parties: a strict content security policy only allows the site's own files, and everything, including the search, runs in your browser.
The look is calmer: dark by default, serif headlines, white cards, one accent colour. Motion is meant to explain where things come from. The search grows out of the field in the hero and slides back into it, a project card morphs into its detail view (View Transitions), a point on the similarity map grows into its article, and the slogan at the top is "generated" token by token, with a slider to rewind it.
The search box at the top ranks its answers with BM25, the classic keyword algorithm behind search engines like Elasticsearch, tolerant of typos and explaining why each result came up. It only matches words, not meaning, so the redesign tried more: a multilingual semantic search with potion-multilingual-128M, a Model2Vec model by Minish Lab distilled from bge-m3. It is not a transformer but a table with one vector per token. A text is split with a Unigram tokenizer (the most probable split, found with the Viterbi algorithm), its vectors are looked up and averaged; tokenizer and model are about 150 lines of TypeScript without any ML library, and no query leaves the page.
The original table has 500,353 tokens with 256 dimensions each, 512 MB. A build script keeps the 41,605 most probable tokens in Latin script, reduces them to 128 dimensions with PCA and stores them as 8-bit integers: about 5 MB, loaded only once you open the search. Every entry is embedded with its title, answer and English and German keywords, common words removed; matches below a cosine similarity of 0.47 are dropped and the rest is fused with the BM25 ranking by weighted reciprocal rank fusion. The same model lays out the similarity map of the projects, at build time.
The honest result: on 24 test questions (12 English, 12 German) the shrunk model alone found the right answer for 16, and nonsense often scored as high as real matches. Combined with BM25 it answers 18 of 24 without false hits, exactly as many as the keyword search once it had German keywords, so most of the gain came from those. Static embeddings average words and don't really understand questions; that would take a transformer such as multilingual-e5-small, about 118 MB. So the semantic part stays a proof of concept.
Behind the playful parts are small physics simulations, each kept free of the DOM and covered by tests. The regatta behind the timeline sails with a polar diagram modelled on a keelboat of about eleven metres: the boats beat towards their buoys in tacks, heel with the apparent wind and keep score, and your pointer is the wind, measured in Beaufort. The sea in the contact section is a row of springy water columns in which the message in a bottle floats, can be thrown, and the letter rolls around inside.
The cyclist on the line at the bottom of the page is a rigid body with contacts at his wheels, saddle and head: he gets back up after a fall, uses lines of text as ledges and splashes into the sea. The tiles around the profile hang on springs. And the gravity button lets the project carousel break apart into a pile of rigid boxes, a small port of Box2D-Lite with friction and stacking, before the cards float back into place.
Most of it you find by trying things. Grab the bottle, the cyclist or a tile and throw them, look at the bottle box at night, turn up the wind on the regatta, or switch on gravity and shake the pile. If you are short of patience, the search knows where things are.
