I like personal sites that feel cared for. The layout and writing do most of that work, then the tiny interactions and slightly unnecessary details make the place feel like it belongs to somebody. The browser sees a different version of this story. Before a person has read the first sentence, it has already found the HTML, CSS, fonts, images, scripts, favicons, and a few requests that somebody once described as “small”. I opened the network panel on my homepage to see what my taste was costing.
The HTML arrives first and immediately introduces the browser to the rest of the bill: styles, local fonts, favicons, the profile image, the theme bootstrap, the header telemetry, and eventually things such as weather or GitHub data. Some of that work is required and some exists because I wanted the site to feel like mine. I am completely fine spending bytes on personality. I only want to know when I am doing it, because accidental personality is usually just a slow request with a cute explanation.
The site uses Space Grotesk and JetBrains Mono. I like both fonts enough that I
would notice if they disappeared, so keeping them is a real design choice for me.
They still have to be fetched before the final type settles. display=swap helps
and preconnect can help, but neither turns a font file into free air. If the site
starts feeling rough on mobile data, I will check the number of weights, whether
self-hosting still makes sense, and whether quieter parts of the page can use a
system font. “I like it” is a valid answer on a personal website. It just cannot
end the performance conversation by itself.
The theme bootstrap lives in the head because a late theme switch gives the page an ugly flash. That makes the script early and therefore expensive in the way all early work is expensive: it gets to delay everything behind it. Its job is small, so the code should read the stored theme, check the system preference, set the attribute, and leave before it discovers a side quest. Early JavaScript feels like luggage on a bike ride. I should carry what I need and stop adding things just because the bag technically still closes.
The header is where my self-control gets weaker. It has time, status text, RPM, gear, music, and scroll telemetry because apparently I cannot own vehicles without putting an instrument cluster into my website too. I am happy to spend JavaScript there, but fun UI still needs boring engineering. The initializers must not attach duplicate listeners, DOM writes need to stay cheap, and background work has to stop when the tab is hidden. I started with a tiny panel that amused me and ended up maintaining a small mechanical system. This is a very predictable problem for me.
The rest of the homepage contains GitHub contributions, photos, experience, projects, posts, weather, and contact links. Very little of that deserves to race the first paragraph. Weather can use cached data, GitHub contributions can arrive after the page is usable, and photos below the fold can wait their turn. Astro helps because the page can stay mostly static while the few interactive areas own their client code. The order I want is simple enough: give the reader a page, then wake up the toys.
My first audit is still a couple of boring commands:
curl -I https://wthrajat.com
curl -s https://wthrajat.com | wc -c
After that I disable the cache in DevTools, throttle the network, reload, and sort requests by start time and size. Surprises are more useful than a score. I want to know why a script loaded before the page was useful, why an image is larger than I remember, or why a tiny widget called an API during the first paint. “Because I wanted it” is an answer I can defend. “Oh lol, when did that get there?” usually means I have found the next thing to fix.
My goal is a site that feels immediate on ordinary Wi-Fi while keeping the bits that make me enjoy it. Websites gain weight quietly, in the same way a bike starts making a new sound quietly. One day there is a chhan chhan in second gear and I have to admit I heard it weeks ago.