How it’s built
How this site is built. It is small on purpose: no client framework, no animation library, and every page prerendered and served from the edge.
Platform
- Astro
- Every page is prerendered at build time. Blog posts and /work entries are MDX content collections, one file per language.
- Cloudflare Workers
- Static assets are served from the edge. A small Worker runs first on the localized routes and redirects to English or Spanish from the language cookie or Accept-Language, so there is no client-side redirect.
- Open Graph cards
- Generated at build time with Satori and Sharp from each page’s own title and description: 1200×630, one per page and language.
Performance
- Navigation
- Astro’s ClientRouter with view transitions, and Speculation Rules that prerender a page on hover in Chromium, so most navigations are instant.
- Fonts
- Newsreader and Hanken Grotesk, self-hosted as partial instances of the variable fonts with only the axis ranges the site uses: about half the original weight.
- Measurement
- Lighthouse CI audits the main pages on every pull request; Cloudflare Web Analytics reports real-user Core Web Vitals without cookies.
Design and motion
- Tokens
- Two base styles, Cosmos (cool indigo) and Paper (warm editorial), each with its own neutrals and accent palettes in OKLCH; style, palette and light or dark theme are applied before first paint.
- Motion
- CSS first: scroll-driven animations for the timeline, view transitions between pages, and a few lines of script for the stat counters. All of it behind prefers-reduced-motion.
Workflow
- Quality
- TypeScript, ESLint, Prettier and Node’s test runner for the edge logic, run in CI with a preview deployment per branch.
Activity
The last year on GitHub, generated at build time from the GitHub API and refreshed weekly by a scheduled workflow: no client script, no third-party embed.