22 Oct

10,240 bytes

22. October 2010 by George Profenza

10k1 In August I entered the 10k Apart competition which asked developers to ‘inspire the web with just 10k’. Entries had to be under 10 kilobytes and work in IE9, Firefox and Chrome/Safari. I decided to create a customisable home page, similar to iGoogle or Netvibes. It was probably one of the less interesting entries but nonetheless it proved a good way to learn about code optimisation and compression. You can view my entry here.

10k2 The winning entry was Sinuous(pictured left), a cross platform canvas game. You can play it using your mouse or you can touch using a touch screen device such as the iPhone/iPad/Android. It’s a good entry and I can see why it won due to it supporting mobile devices and being a simple idea implemented well. Other notable entries are an old-school adventure game, Fontanero, which compressed it’s code into a PNG and then decompressed it from the canvas at run-time - a method first written about by Nihilogic.

And Filterrific, an image manipulation app written by Nihilogic that allows you to apply various filters to an image such as blur, fisheye, posterize, etc.

You can view my entry on the 10K Apart website here. The entry consisted of a search bar for Google, three types of widgets; RSS feeds, Twitter user streams and Flickr tag searches, a customisable background image and a customisable greeting.

Everything is stored in localStorage which means it will be remembered after you close your browser. The biggest challenge was finding the balance between the file size and the functionality and deciding what should be included and what was unnecessary. In total the project size was 10,223 bytes which is 17 bytes under. Adding 17 bytes to the project would be equivalent of including ‘if(some_variable)’ in the code.

Subscribe to newsletter:

RSS Feed