Colophon
How this site is built
A publication for engineers should be able to show its own work. Here is the stack, the pipeline an article goes through, and the rules we hold ourselves to.
The stack
- framework
- Next.js 16 (App Router), React 19, TypeScript# pages render on the server; most need no JavaScript to read
- hosting
- Vercel, functions in Frankfurt (fra1)# next to the database, close to European readers
- database
- PostgreSQL on Neon (Frankfurt), Prisma 7# one source of truth, schema changes as migrations
- accounts
- Better Auth: email and password, GitHub, Google# sessions in our own database
- articles
- Markdown → unified (remark, rehype), sanitized# no MDX: an article can never run code
- code
- Shiki through rehype-pretty-code, on the server# highlighted HTML, no highlighter shipped to you
- math
- KaTeX, on the server# formulas arrive as HTML and MathML
- styles
- Tailwind CSS 4, light and dark themes# one set of design tokens, AA contrast in both
- fonts
- Newsreader, IBM Plex Sans, JetBrains Mono# self-hosted by next/font: no font requests to Google
- Resend# the weekly digest and account email, opt-in only
- tests
- Vitest: unit tests and a real PostgreSQL suite# lint, types, and tests pass before anything ships
The rules
Reading needs nothing
Articles are HTML from the server. Highlighting, math, sidenotes, and the incident timeline are done before the page reaches you, and the sidenotes open with a checkbox, not a script. JavaScript adds likes, bookmarks, and search; the text never waits for it.
Static first, fresh enough
Pages are cached at the edge and rebuilt when something is published, or at most an hour later. A reader's request rarely touches the database.
Nothing executable in an article
Every article goes through GitHub's sanitization rules: scripts, event handlers, iframes, inline styles, and
javascript:links are removed. A strict Content-Security-Policy limits scripts to this site, Vercel's analytics, and the Cloudflare check on sign-up forms.Keyboard and screen readers
Press ? for shortcuts (j/k move through lists, / searches). Every control has a visible focus ring and a name, and motion stops when your system asks it to.
Measured, in public
The footer shows what the page you're on cost to load, measured by your own browser: bytes, requests, and seconds. If a change makes it heavier, you'll see it there before we do.