← Back

Colophon

How this site works, what it runs on, and why.

Architecture

Static HTML generated by Astro 7 at build time. Zero runtime dependencies — no React, no Vue, no framework JS. One page, one HTML file, one JS bundle. The entire site ships under 320KB including fonts.

Motion

Every animation is hand-written CSS transitions triggered by IntersectionObserver. No GSAP, no Framer Motion, no animation library. Section reveals, staggered list entrances, and the hero word-rise are all vanilla. The WebGL noise field behind the hero is a raw vertex/fragment shader — no Three.js.

Terminal

The interactive terminal is a real command interpreter: pipes (projects | grep rust), tab-completion, history, and 30+ commands. Three commands — rrf, hash, xor — lazy-load an 843-byte Rust→WebAssembly binary and run real compute in the browser. The WASM is a prebuilt artifact committed to the repo; CI does not compile Rust.

Theming

Dark and light themes via CSS custom properties. The accent color shifts by time of day in the Baku timezone — five periods from night violet through morning gold to evening amber. The theme toggle uses the View Transitions API for a circular clip-path wipe on desktop.

i18n

English, Russian, and Azerbaijani. All translations live in profile-i18n.ts. Section markup is generated by pure string builders that run identically at build time (SSR) and runtime (language switch), guaranteeing the two paths never drift.

Typography

Manrope for body, Cormorant Garamond for display, JetBrains Mono for code. All self-hosted with unicode-range subsetting. Total font weight: 232KB across 12 woff2 files. The LCP face is preloaded.

Performance budget

No external CDN requests. No analytics scripts. Fonts are self-hosted. The Spotify widget hits a Cloudflare Worker proxy. Images are lazy-loaded. The WebGL shader pauses when off-screen and respects prefers-reduced-motion. The site scores 95+ on Lighthouse.

Accessibility

WCAG AA contrast on all text. Skip link, focus trap on modals with focus restoration, semantic heading hierarchy, aria-live regions on dynamic content, prefers-reduced-motion honored throughout. Keyboard navigable via vim-style chord shortcuts.

PWA

Optional offline mode via a root-scoped service worker (network-first for navigations, stale-while-revalidate for assets). Enabled/disabled through the terminal: offline enable.