A portfolio in 1.5KB

Welcome. This is the part of my site where I'll write things — about engineering, AI agent systems, web platform minimalism, and work I've shipped. First post, so let me explain what you're looking at.

Each page on this site is under 1KB brotli on the wire. The home page is 875 bytes. No JavaScript, no build step, no external dependencies, no fonts. Static HTML with one inlined <style> per page. That's the whole stack.

I built it this way as a deliberate POC. Most sites optimize for the wrong thing — adding tools and frameworks for problems they don't have. I wanted to see how far you could push the platform itself before reaching for anything else.

Four decisions did most of the work.

Inline the CSS

External style.css looks cleaner but costs an extra HTTP round-trip on first load. For a 3KB stylesheet that's a bad trade — round-trip latency dominates over caching gains, and most visitors view one or two pages anyway. Inlining makes each page a single request.

light-dark() instead of @media

The CSS function light-dark(light-color, dark-color) resolves at use site based on the page's color-scheme. It replaces a whole @media (prefers-color-scheme: dark) block:

:root { color-scheme: light dark; --m: light-dark(#666, #888); }
body { background: light-dark(#fafafa, #111); }

Supported in every browser shipped after early 2024.

System fonts, no font files

font: 16px/1.6 system-ui, sans-serif. No custom fonts, no preload tags, no FOUT. Modern OSes already ship a perfectly good UI font — use it.

Pre-compress with brotli

Cloudflare Pages auto-detects .br siblings next to your HTML files. Generate them once at the highest quality, ship them alongside, the host serves them. About 20% smaller than gzip, for free.

brotli -q 11 -k index.html

Where this lives

Cloudflare Pages. Brotli .br siblings auto-served, HTTP/3 + 0-RTT on by default, edge cache global. Deploying is npx wrangler pages deploy .. The whole site is ~35 files including the pre-compressed siblings.

The numbers

Every page fits in a single TCP packet (1460-byte MTU). That means the browser receives the entire HTML document — including its CSS — in one network round-trip after DNS and TLS resolve.

What's next

I'll write here when I have something specific to say. No schedule. Themes are web platform minimalism (this post is one), AI agent infrastructure, and full-stack patterns. Plus whatever else doesn't fit.

If you want to talk about any of it, I'm at vivek.ravindran01@gmail.com.