8 kilobytes of Mario
So, I had this stupid idea for a rather alternative way to compress things like Javascript using the canvas element. Using this technique, the small 14 KB Super Mario game I previously posted now only takes up about 8 KB.
The files involved are a PNG file and a small Javascript file. In short, the real Javascript is embedded in the PNG file and then read and executed by the small JS file. I will post more about this compression later.
The reason it's a somewhat stupid idea (or one of the reasons, anyway), is that it's only supported by canvas enabled browsers and only those that implement the getImageData method, which renders it pretty useless for real life use at this point.
For now, that means only Firefox, Opera Beta and the recent WebKit nightlies work.
Check it out here
So, I had this stupid idea for a rather alternative way to compress things like Javascript using the canvas element. Using this technique, the small 14 KB Super Mario game I previously posted now only takes up about 8 KB.
The files involved are a PNG file and a small Javascript file. In short, the real Javascript is embedded in the PNG file and then read and executed by the small JS file. I will post more about this compression later.
The reason it's a somewhat stupid idea (or one of the reasons, anyway), is that it's only supported by canvas enabled browsers and only those that implement the getImageData method, which renders it pretty useless for real life use at this point.
For now, that means only Firefox, Opera Beta and the recent WebKit nightlies work.
Check it out here
Your work is absolutely incredible. I'm a big fan.
May 4, 2008 at 7:08 AM UnknownProblems using Fx3 (Build: 2008050206)
May 4, 2008 at 7:13 AM Anonymoussyntax error
http://www.nihilogic.dk/labs/mario8kb/m.js
Line 3
Amazing!
May 4, 2008 at 8:32 AM Jacob SeidelinThanks.
May 4, 2008 at 10:35 PM Anonymous@execvator: Works fine for me. Don't know what causes your error.
nihilogic - the best!
May 5, 2008 at 2:15 AM UnknownSorry about that, works great now with build 2008050406. The previous one just gave me something that looked like utf-8 'encoded' as us-ascii.
May 5, 2008 at 5:05 AM SchillAnyway, really great idea and nice work as always!
You sir, are crazy! Keep up the good work. Much respect. Unfortunately you're probably going to get a few hacker types fiddling with this idea now for embedding exploit code - though since IE doesn't support this, perhaps it's still fairly safe. ;)
May 5, 2008 at 8:36 AM AnonymousFWIW the irony of encoding a PNG in JS, encode the JS in PNG then decode the PNG in JS to generate a PNG is not lost on me :)
May 6, 2008 at 1:45 AM Jacob SeidelinHah, you're quite right.
May 6, 2008 at 2:08 AM AnonymousHm. Maybe I can rework it to have code, sprites and music stored next to each other in the same PNG and just reference the offsets from the code.
Awesome! :)
May 12, 2008 at 8:28 AM AnonymousAww, no flag at the end ? :(
May 15, 2008 at 3:08 AM AnonymousStill, awesome that you made it even smaller than the last time.
You sir, are a genius!
August 23, 2008 at 6:14 AM AnonymousIt's a pity so many people still use IE/non-canvas browsers, otherwise the web could advance much further, and with something like processing.js, do away with flash. Keep up the great experimentation.
Marie the best !!
August 26, 2008 at 8:26 AM UnknownAmazing :) cool idea
November 17, 2008 at 6:26 AM Prince_PorterThat's absolutely insane, I really need to increase my programming knowledge, this is exactly the kind of stuff I want to be able to do.
October 26, 2009 at 8:17 PM AnonymousAmazing work, it's just a shame that you hide the source code so that others can learn from you.
November 25, 2009 at 9:29 PM AnonymousThis has everything you need to make a real game. Image loading, image moving, good use of variables, basic collision, and terrain scrolling.
Could you please make the source public so that we can learn?
Neat, but this is just gzip compressing the code in a less efficient way than using the browsers built in gzip support (which runs on all browsers):
March 2, 2010 at 5:23 AM Jacob Seidelin$ ls -lh mario_compressed.js.gz
-rw-r----- 1 hearn eng 7.1K Apr 9 2008 mario_compressed.js.gz
So you can have this size improvement just by tweaking your server config. No PNGs required.
whooooosh
March 2, 2010 at 5:48 AM AnonymousI had problems.
January 26, 2011 at 12:32 PM1. Every block, even ones with mushrooms, give you coins.
2. I got ahead of the scroll and it locked up.
3. At the end, there was a block, no flagpole, and a big white space.