js1k

What can YOU do with a kilobyte of JavaScript?

By | | Programming

3

The JS1k competition, announced last week, challenges entrants to code up a JavaScript demo in less than a kilobyte (1,024 bytes). The rules are simple: your demo must run in the current versions of Firefox, Safari, Chrome, and Opera without crashing. Style doesn’t count, so eval away. And you can only submit one entry per person—the last entry you submit before the deadline will be the one that counts, so revisions and updates are possible. Minimization, of course, is permitted.

The script you submit is placed inside a script tag in a frame containing only a canvas element. Most of the scripts submitted so far have been graphical demos. Here are a few of the most interesting ones, in my opinion:

  • Marijn Haverbeke has submitted a fairly sophisticated side-scrolling game, where you control three different spaceships and try to prevent enemy ships from reaching the right side of the screen. Demo, source.
  • Tom Boshoven (as well as a few other participants) has implemented Conway’s Game of Life, complete with Play/Pause and speed controls. Demo.
  • Quite a few people have implemented JavaScript syntax highlighters.
  • Jonas Wagner had my favorite of the lot: a demonstration of evolution by natural selection. His script starts with a population of colored squares on a randomly-colored background. Each square has three “genes”: the R, G, and B components of its color. Each “generation,” the simulation kills a few cells—but not randomly: the cells whose color differs most from the background are more likely to be killed. Then, new cells are “bred” to fill in the space by combining the genes of surviving cells, and each new cell is given one random mutation. That’s all there is to it. Click through to the demo to watch the squares evolve their camouflage, and have a read of his blog post to see how it’s done. As if this wasn’t all cool enough, he’s used whitespace in his minimized script to draw a profile of Charles Darwin.

Have a look at the full list of demos and see what others have done.

The entries will be judged by a jury, and prizes (including a number of books and seats at the HTML5 Mobile Pro workshop) will be awarded. The deadline is September 10th, so I’ll ask again: What can you do with 1KB of JavaScript?

Learn Responsive Web Design

Join Learnable $29 Includes all SitePoint books

Louis Simoneau

Louis joined SitePoint in 2009 as a technical editor, and has sinced moved over into a web developer role at Flippa. He enjoys hip-hop, spicy food, and all things geeky. You can find him at louissimoneau.com, and on Twitter @rssaddict.

More Posts

{ 3 comments }

Simon August 11, 2010 at 9:24 am

This one is my fave http://js1k.com/demo/171

Andy_Read August 11, 2010 at 8:23 am

For a REAL challenge you should try writing something interesting for the first ever stored program computer (see http://www.computer50.org/mark1/prog98/). Never mind 1k of javascript code – try 32 words of 32 bits (=128 bytes) which cover code, variables AND display :-)

dawgbone August 10, 2010 at 11:21 pm

Make it a real challenge and make it work in IE as well.

Comments on this entry are closed.