[ /tiny/images ]

It bothers me that the modern web has become as heavy as it has. Maybe I'm old-fashioned, maybe it's just a peculiar OCD symptom.

It's been a while since I've purchased a new computer. Most of the equipment I use is at least five years old, and for the most part that suits my needs. The heaviest applications I use are VLC, Inkscape, GIMP, and Firefox.

Most of the time I stick to command line applications like Vim. I don't limit myself to this because my hardware can't handle something heavier, but because it allows me to use the same toolset whether I'm editing locally or remotely, it's incredibly customizable, and it fits into my workflow better (see my post about tmux to understand how).

Now, it just doesn't make sense to edit images or vector graphics from the command line most of the time (though if you can write scripts with imagemagick to automate certain tasks, you'll get a lot more done than if you do it by hand). Also, while you can watch videos in your terminal using VLC or MPlayer, it's not as nice of an experience as using the actual resolution of your display.

Conserving resources on the web

The web is a somewhat different case. If I use a resource-intensive application for watching a video locally, it has no effect on any computer except my own. In order for you to use a network application, a signal needs to be sent through a large number of intermediaries. Everything on the network is relayed by somebody.

The current reality is that most of these resource-intensive applications are carried by ISPs, so the number of intermediaries required to get a signal from its source to your screen is opaque. Personally, I find that less than ideal, and would rather move towards a future that allows for a more distributed, peer to peer architecture. In order for that to be a reality, more people need to start making better use of the bandwidth that they have available.

I've made this site more efficient by using clientside javascript to prevent full pages from loading. Instead, once you've hit your first page, only content that needs to be updated is loaded. This is a technique called REST (REpresentational State Transfer). It makes it easier for a server to serve more clients, and limits the amount of bandwidth used.

Even using a RESTful architecture, there's no way to get around having to send the actual assets that you want your client to have. Of course, if you can make those assets smaller before sending them...

Optimizing assets

For a long time I only shipped html, css, and js over the wire. In the interest of making my site a little more pleasant, I've started to use more images. Generally the text content can be counted in bytes, images are often much larger than is necessary.

Fortunately, there are open source tools available that you can use to optimize your images for inclusion in your web pages. I use GIMP for image processing, and it has an easy to use plugin: save for web.

If you're using Ubuntu, you can install it like so:

ansuz@flip:~$ sudo apt-get install gimp-plugin-registry
[sudo] password for ansuz:
Reading package lists... Done
Building dependency tree
Reading state information... Done
The following extra packages will be installed:
  gimp-gmic liblcms1 libtiff-tools
Suggested packages:
  gmic icc-profiles liblcms-utils libtiff-opengl
The following NEW packages will be installed:
  gimp-gmic gimp-plugin-registry liblcms1 libtiff-tools
0 upgraded, 4 newly installed, 0 to remove and 0 not upgraded.
Need to get 3,243 kB of archives.
After this operation, 10.5 MB of additional disk space will be used.
Do you want to continue? [Y/n] Y

Then just open your image in GIMP, and look in the File menu. You should see a Save for web entry. It will open a popup with a lot of options, as well as a preview for how your image will look after optimization.

Certain options will degrade your quality quite a bit, so you need to be careful before overwriting your source file. If you pick the right settings, however, you should be able to get your file size down quite a bit. I was able to get a lot of images down from 700kb down to 70kb.

There's more that we can do, but that's a start.