65 lines
3.0 KiB
Markdown
65 lines
3.0 KiB
Markdown
+++
|
|
date = "2016-01-06"
|
|
title = "Putting ariejan.net on a diet: a 69% reduction"
|
|
tags = ["web"]
|
|
description = "Websites are getting bigger and fatter, let's put ariejan.net on a diet."
|
|
slug = "putting-ariejan-net-on-a-diet-a-69-percent-reduction"
|
|
+++
|
|
|
|
You may have recently read [Website Obesity](http://idlewords.com/talks/website_obesity.htm) by
|
|
[Maciej Cegłowski](http://idelwords.com/), as featured on [Hacker News](http://news.ycombinator.com).
|
|
There's a lot of great stuff in that article. The most obivous and striking thing is that there
|
|
is a lot of bloat on the web. Examples include a tweet (140 characters) that is served as a
|
|
900kB website. How to optimize a website and remove bloat is a topic in and of itself. I can
|
|
highly recommend the article mentioned above.
|
|
|
|
## Taking a look at ariejan.net
|
|
|
|
The article by Maciej triggered me to take another look at ariejan.net and see if I can make it
|
|
any better (bloat-wise). But first, let's take a measurement of the current situation. I'm using
|
|
[Yslow](http://yslow.org/) as a Chrome plugin for this.
|
|
|
|
|
|
|
|
The frontpage, which a list of all my posts, weighs in at **256.8kB**. 170kB for the actual HTML document,
|
|
but there's also almost 100kB of CSS and JavaScript.
|
|
|
|
## A change of scenery
|
|
|
|
The first thing I did was delete everything in my CSS file and remove all unneeded content from the
|
|
frontpage, including tons of specific dates, word counts and reading times. In general I simplified
|
|
the HTML quite a bit, removing unneeded elements. Feel free to take a look, you know you want to.
|
|
|
|
On the article pages I also made a few changes, most notably removing the Disqus comments. The reason
|
|
for this is twofold: comments just don't add much as most people tweet or mail anyway and it adds
|
|
a reasonable amount of extra JavaScript. I might change my mind on this, but for now comments are gone.
|
|
|
|
I was also using Google Fonts to make things look pretty. Well, guess what, I don't care that much
|
|
about pretty. Out with the webfonts. Instead, I opted to for the 'retro look' with a nice web-safe
|
|
monospaced font.
|
|
|
|
Because of this change in style, I also set up a new favicon, which turns to be 25% of its original
|
|
size as well.
|
|
|
|
## The result
|
|
|
|
|
|
|
|
From **256.8kB** down to **78.8kB**. If you have any kind of decent connection, you probably
|
|
won't experience a big difference. Still, the bloat on ariejan.net's frontpage has been
|
|
reduced by more than 69%.
|
|
|
|
The document (HTML) size has been greatly reduced, simply by omitting data I don't need and
|
|
removing unneeded (and over 300 times repeated) markup.
|
|
|
|
JavaScript is still at 26kB because Google Analytics. I'm _not_ happy with that and I'm
|
|
looking at other options to monitor popular content and visitor numbers, suggestions are
|
|
welcome.
|
|
|
|
## What's next?
|
|
|
|
Nothing much. I might look in to replacing Google Analytics. Maybe I'll restore comments
|
|
if I get complaints about that. Other than that, I'm quite happy again with the new
|
|
"design" and most importantly, my site's weight.
|
|
|