A few days back I was perusing the ESPN.com source code when I found the following snippet of code:

<script>
	ESPN_refresh=window.setTimeout(function(){window.location.href=window.location.href},900000);
</script>
<noscript>
	<meta http-equiv="refresh" content="900" />
</noscript>

I understand what the code was supposed to do but was confused as to why they’d use javascript as a primary method and META as a fallback method. Why not just use the META method? I did some research and found the answer at Wikipedia:

CSS sprites are all the rage these days. And why shouldn’t be? They’re easy to implement, have great upside, and usually take little effort to create. Dave Shea wrote an epic CSS sprites navigation post titled CSS Sprites2 – It’s JavaScript Time. In his post he outlined a method for enhancing the CSS sprite menu with jQuery. I loved his post so much that I converted his jQuery CSS sprites menu to MooTools.

The Sprite Image

This is a great example of an efficient, useful sprite image.

One of the biggest goals with my website redesign was to update something no one sees — website speed. Sure I’m using different colors, fonts, javascript techniques, and images but I’m most proud of the the speed increases I made. Let me explain the ways I’ve improved my website performance — maybe you can learn something from what I implemented.

Image Optimization – PNG Crush

Unlike varying content pages, Images are a fixed download size so I sought out to optimize image sizes. I used PNGCrush to compress images without loss of image quality. Using PNGCrush I was able to knock off 120KB of useless image space.

One of my MooTools plugins I use most is TwitterGitter. TwitterGitter is a small MooTools plugin I’ve created to fetch any number of tweets from an Twitter user’s account. Since clients don’t tweet very often, there’s no advantage to pinging Twitter for a tweet every page load. To save Twitter a bunch of repetitive requests, I use cookies to save the latest tweet.

Now that I’m knee-deep in MacBook I love working with command line applications. There’s a certain beauty in the simplicity of using the console instead of a nice GUI. One task I use the console for often is reducing the size of PNG files using the powerhouse that is PNGCRUSH.