Website


ON: BY: Christopher Hannah

I’ve done some minor researching into this idea of mine, that really became a thing when I started making my blog super lightweight. And I really want to carry that over into whatever this project becomes.

Whatever I do, will of course be personally oriented, and it will be packed full of decisions that wouldn’t work best for most people. But it’s a personal project first, and if it becomes more flexible and open in the future, that’s just a bonus.

What To Track

With Google Analytics, you get a whole bunch of stats. This can be really handy for someone trying to deeply understand interactions with a website, but it’s a bit over the top for the menial use I want out of it. There’s also the added fact that you’re tracking your users — it’s not a big deal, but I’d rather not invade people’s privacy.

There are very minimal metrics that I want to capture, and that is page views, referrer websites, and possibly number of sessions - although I don’t care about this too much. But regarding the first two, this can be completed by simply telling something the page that’s been loaded, and what referred it. Luckily for me, it’s all in the HTML DOM and I think I’ll be able to do this super minimally.

The way’s this basic data could be used is also rather interesting to me, as when the message is received (by a server, or whatever), a date can be applied. Which means the data can be sorted by the date, collated into individual pages, and some pretty cool graphs could be made from it.

How to do it

For the sake of the front-end implementation, I plan this to be a simple PUT request, which will send the (as mentioned above) data to whatever server that is in control of the analytics. From there, it will require no more work from the client.

For the back-end, the speed, and “heaviness” of the implementation isn’t super important for me at the beginning stage. Because initially it will only serve myself, so it’s not a big load that will be put on it. But my first idea is to use a cloud server on Digital Ocean, to host a Swift server app! Built using Perfect, because I had a great experience with it when I experimented with a text formatting API. There’s also the fact that I am mainly a Swift developer, and is more likely to get finished if I make use of that.

Progress

As with all my other projects, I’ll be pretty vocal with the progress, and try to share as much as possible. This will be done mainly on Twitter, where you can follow me at @chrishannah, and if you want to know something I haven’t shared yet, just ask!

ON: BY: Christopher Hannah

I’ve been getting more obsessed with these two things recently, and you may have already noticed it with the recent “redesign”, if you can call it that. Basically, the design has been simplified even more, and a higher focus (like everyone always says) has been put on the content.

I’ve had this mindset towards website sizes, and how fast they should load for quite a while. But it’s only the past week or so that I’ve put effort into sorting out my website.

It started with optimising the images on the website, which consisted of resizing every image so that the width didn’t exceed 1400px and height didn’t exceed 1200px. They’re not exactly small sizes, but we live in a Retina world, and I have to put up with that. On top of that, all PNGs were put through the highest compression in Squash 2, and any image that was currently on the front page (I really couldn’t be bothered to do this for every post), was converted to JPG.

It was a decent start, and it certainly made a noticeable change in the size, with it taking my home page from 6MB to 1.2MB. It’s a relatively big difference, but I still felt that it wasn’t near enough what I was aiming for.

My desire is to have my website show off the content really nicely, be measured in mere kilobytes, and load so fast it’s not even recognisable.

Fast forward to today, where both the size and load speed metrics have improved a lot. I’ve been playing around with a few static site generators, and thinking about doing a more custom approach to the website, but I realised that Ghost (what this site runs on) can be manipulated itself. So for now, nothing major has changed with the underlying blog engine.

I have done a few things though:

  • Removed Prism - this was the already small library that I used to style any embedded code, but it’s not really relevant.
  • Cleaned up and minified my CSS file (yes, I write basic css).
  • Removed all javascript, including Google Analytics!

Google Analytics was the hardest to remove, but I got down to a point a page showing a single text-only post, would be roughly 50KB. 29KB of that was Google Analytics. This was didn’t seem like nice ratio to me, so for now it is gone. Hopefully in the future, I can write something minimal myself to track basic page views, but I’m not worried about that just yet.

Here are a few examples of the website size and load speeds:

I’m really happy with the low page sizes, and it appears the only thing truly adding to the size now is the images, which I can deal with. I’ll just start to use them where the need to be used, and nowhere else. The load speeds varied across multiple attempts, so that’s why a range was given (caches were disabled).

My next step will be to try and further optimised the actual Ghost engine itself, to see if any speed improvements can be made there. And I guess maybe an improved cloud server would help also? Then there is the dream goal of custom web analytics.

So rest assured, for now, nothing is being tracked on this website.

I’d be very interested in hearing everyone else opinions on website sizes, and all the rubbish I’ve wrote here in this post. Because while I really want my blog to be under 10Kb in most scenarios, it probably doesn’t make a huge difference to the reader.