hazardous

thoughts, things, etc. from andrew snow

about

Welcome to haZardous, a website. My name is andrew snow, though i've been known to go by the handle subspacer from time to time. I have always had an interest in technology, if not the means to pursue it professionally. I am very curious by nature, and this has led down all sorts of rabbit-holes, ranging from hardware- to software-level - the website you are looking at runs from a virtual server provided by digitalocean and running Ubuntu - everything else was setup personally by yours truly,from the webserver to the static-site generator and even the SSL certificate securing it all. Along the way I used bits and pieces of the languages I have become familiar with such as html&css, bash scripting, sql, php and javascript. The most important tool I used, however, was the collective wisdom and creativity of the internet at large, in particular countless users on GitHub who maintain the open source knowledge that has helped me learn so much and in return, hopefully contribute to.

the hazardous server

Webpage Test scores. I consider the big ol' X to be a good thing in light of recent events1. :)

optimized

This is a breakdown of the server's performance load. A vast majority of the time is dedicated to waiting for your browser to download the ~150-kilobyte font! The javascript all comes in at a bit less than half of that. Its total footprint is so small, that the total processing power required by the cpu barely registers on the chart. The most amount of time the cpu spent actively processing was dedicated to simply rendering the HTML!

bleeding edge

Above: loading the website over traditional HTTP/1.1. Below: loading the same page over HTTP/3.

The benefit of using a custom nginx server is the ability to take advantage of Brotli and cutting edge technology such as the http/3 protocol. As you can see in the above waterfall, after establishing a secure handshake with the browser, multiple simultaneous connections can be established with the server, allowing for vastly improved load times compared to http1.1, where waiting for each piece of data was transferred before beginning the next was appropriate for the average computer performance of the internet it was designed around.

Thus, when I built my website, I was able to take full advantage of things like the prefetch and preload tags at the code level, and optimize both text and graphics thanks to gzip and brotli, resulting in an already-optimized website to be served lightning fast over QUIC. The result is almost a full milisecond shaved off of what was already an incredibly short load time.

software


Inter

Typography provided by Inter, a fantastic font with a focus on web readability. I wanted something beyond the default font choices on major operating systems, but I also wanted to avoid relying on the Google Fonts service as well.

In tuning the font to be legible and crisp, I've learned quite a bit about the rendering side of modern browsers, and how to use CSS selectors to tweak the font's presentation to my liking. I'm still very much a learner in this area, so if you see something I could improve upon, please let me know!

Mecha

The heart of zardo.us is Mecha CMS, an incredibly nifty little backend for the hobbyist dev. It's deceptively flexible and endlessly tweakable - but it's a fairly small project, which means the documentation is very minimal. I really like that - it means to work on this website, I have to learn more about a variety of languages and running a webserver.