Home > Programming > JS1k: Making a very small game in JavaScript part 1 – tools

JS1k: Making a very small game in JavaScript part 1 – tools

December 2nd, 2010

Well, that was fun. I’ve just submitted my JS1k Xmas edition demo. I only heard late on when the first JS1K happened, and I wasn’t up to coding anything decent at that stage anyway. So when I heard about this new one, I jumped on the task, working all weekend on it (except when I had to help move a piano). By the end of Sunday it was done, and I was mostly happy with it.

Before I started, I wanted to see if there were any good resources out there for this kind of thing, so I asked on Stack Overflow. I got a few good tips there, but the most useful one was probably:

You need to have the extreme small file size in mind when you write the code. So in part, you need to learn all the tricks yourself.

Show me the code!

Here’s the minified source of my submission. Trying to read minified JavaScript is a bit like reading assembly language when you’re used to C, or bytecode when you’re used to Java, so don’t try to understand it too much. Have a look at the un-minified code to see what it originally looked like.

It’s all up on github as well if you want to see the commit history.

Tools of the trade

I realised early on that I needed to have a quick way of minifying my code and checking its size. I started off playing with the Google Closure Compiler web interface but it was too slow to continually copy-paste my code in there. I downloaded it as a CLI app. Next off, I wrote this Makefile:

default:
    java -jar compiler.jar --compilation_level ADVANCED_OPTIMIZATIONS --js kave.js --js_output_file kave-min.js
    stat -c%s kave-min.js

The first line uses Closure to compile with advanced optimisations, and the second outputs the size of the minified file. With this, all I had to do was type make to see what the minified filesize would be. Being able to do this after every tiny optimisation was extremely useful, as I could quickly experiment with new techniques and see if they were worthwhile.

Learning the tools

It’s important to understand what the compiler is actually doing, and what it’s able to do. Reading through the Advance Topics in the Closure docs was essential. Closure will do some pretty advanced optimisations, but it needs help. For example, it doesn’t touch strings (thankfully). That means if you refer to a method in one place as obj.meth and in another as obj['meth'], it can’t rename obj.meth.

Another big no-no is with, which is good, because it just confuses things anyway. Using with means Closure can’t distinguish between properties and local variables, so there are a lot of name shortenings it just can’t do.


In Part 2, I’ll look at some of the specific optimisations that I used.

Categories: Programming Tags: ,
  1. July 9th, 2013 at 03:44 | #1

    Fine way of explaining, and pleasant post to get information regarding my presentation topic, which i am going to convey in school.

    Feel free to surf to my blog; [goodgame empire cheat engine hack](http://www. youtube.com/watch?v=aw-mZ76tK1E “goodgame empire cheat engine hack”)

  2. December 13th, 2013 at 23:05 | #2

    Hey there! Do you know if they make any plugins to help with Search Engine Optimization? I’m trying to get my blog to rank for some targeted keywords but I’m not seeing very good results. If you know of any please share. Cheers!

  3. March 12th, 2014 at 01:05 | #3

    It’s actually a nice and helpful piece of info. I am glad that you shared this useful info with us. Please keep us informed like this. Thank you for sharing.

  4. May 22nd, 2014 at 04:33 | #4

    Heya! I’m at work surfing around your blog from my new iphone! Just wanted to say I love reading through your blog and look forward to all your posts! Carry on the fantastic work!

  5. June 5th, 2014 at 03:35 | #5

    First off I would like to say terrific blog! I had a quick question which I’d like to ask if you don’t mind. I was interested to find out how you center yourself and clear your head prior to writing. I have had a difficult time clearing my mind in getting my ideas out. I do enjoy writing however it just seems like the first 10 to 15 minutes are generally wasted just trying to figure out how to begin. Any ideas or tips? Kudos!

  6. July 5th, 2014 at 14:29 | #6

    Greetings! Very useful advice in this particular post! It’s the little changes that make the largest changes. Thanks for sharing!

  7. August 26th, 2014 at 13:55 | #7

    This web site really has all the information I wanted concerning this subject and didn’t know who to ask.

  8. August 31st, 2014 at 10:05 | #8

    You’re so awesome! I do not suppose I’ve read through a single thing like that before. So good to find another person with some genuine thoughts on this subject. Seriously.. many thanks for starting this up. This site is something that is needed on the web, someone with a little originality!

  9. October 1st, 2014 at 05:02 | #9

    I’m not that much of a internet reader to be honest but your sites really nice, keep it up! I’ll go ahead and bookmark your site to come back later on. All the best

    My blog :: [disability dating](http://sweezy-esports.com/index.php?mod=users&action=view&id=38957 “disability dating”)

  10. October 6th, 2014 at 15:24 | #10

    Wow that was odd. I just wrote an really long comment but after I clicked submit my comment didn’t appear. Grrrr… well I’m not writing all that over again. Anyway, just wanted to say great blog!

  11. February 16th, 2015 at 01:11 | #11

    Asking questions are actually nice thing if you are not understanding something totally, except this post offers nice understanding even.

  12. March 13th, 2015 at 00:16 | #12

    Hello everyone, it’s my first pay a visit at this website, and piece of writing is genuinely fruitful in support of me, keep up posting these types of content.

  13. May 26th, 2015 at 03:45 | #13

    I’m amazed, I have to admit. Seldom do I encounter a blog that’s both educative and engaging, and without a doubt, you have hit the nail on the head. The issue is something too few folks are speaking intelligently about. I’m very happy I stumbled across this during my hunt for something relating to this.

  14. May 26th, 2015 at 03:57 | #14

    It’s actually a nice and useful piece of info. I am satisfied that you just shared this helpful info with us. Please keep us informed like this. Thank you for sharing.

  15. May 26th, 2015 at 04:00 | #15

    It’s hard to come by knowledgeable people in this particular topic, but you sound like you know what you’re talking about! Thanks

  16. June 1st, 2015 at 19:49 | #16

    It’s amazing to pay a quick visit this web page and reading the views of all friends about this post, while I am also keen of getting experience.

  17. June 18th, 2015 at 10:17 | #17

    Right here is the right webpage for everyone who would like to find out about this topic. You realize so much its almost hard to argue with you (not that I really will need to…HaHa). You certainly put a new spin on a topic which has been discussed for ages.

    Excellent stuff, just excellent!

  18. July 6th, 2015 at 21:46 | #18

    Right here is the right site for everyone who wishes to find out about this topic. You realize a whole lot its almost hard to argue with you (not that I really will need to…HaHa). You definitely put a new spin on a topic that’s been written about for years. Wonderful stuff, just excellent!

  19. July 7th, 2015 at 17:49 | #19

    It’s hard to come by experienced people for this topic, but you sound like you know what you’re talking about! Thanks

  20. August 10th, 2015 at 06:00 | #20

    It’s an amazing post in support of all the online visitors; they will get advantage from it I am sure.

  21. September 6th, 2015 at 07:42 | #21

    Hey There. I discovered your weblog the use of msn. That is a really neatly written article. I will make sure to bookmark it and come back to learn more of your helpful information. Thank you for the post. I will definitely comeback.

  22. October 6th, 2015 at 09:05 | #22

    This was among the best posts and episode from your team it let me learn many new things.

  23. December 7th, 2015 at 23:09 | #23

    Thanks a lot for sharing this with all of us you really recognize what you are talking about! Bookmarked. Kindly also talk over with my website =). We could have a link exchange contract between us

  24. December 9th, 2015 at 23:06 | #24

    Hi to all, the contents present at this site are really amazing for people knowledge, well, keep up the nice work fellows.

  25. January 3rd, 2016 at 08:20 | #25

    Hello my family member! I want to say that this article is awesome, nice written and come with approximately all significant infos. I would like to see more posts like this .

  26. January 19th, 2016 at 06:53 | #26

    This is a really good tip particularly to those new to the blogosphere. Short but very accurate information… Appreciate your sharing this one. A must read article!

  27. January 20th, 2016 at 23:04 | #27

    If you wish for to grow your familiarity simply keep visiting this web site and be updated with the most recent information posted here.

  28. January 28th, 2016 at 02:29 | #28

    Hey very cool website!! Man .. Excellent .. Amazing .. I’ll bookmark your website and take the feeds also? I am satisfied to seek out so many useful information here in the publish, we need develop extra strategies on this regard, thank you for sharing. . . . . .

  29. February 4th, 2016 at 06:32 | #29

    Will not handle the analysis thesis. Asked if the new mechanism will involve withdrawal of securities including by universities, Adrian Courage highlighted “major scientific role” of them. “I find it essential to understand the role of major scientific and responsibility that have universities. There may be another forum in the world. There is research out there, a direct,

    http://30daychangescam.com/

  30. February 18th, 2016 at 17:59 | #30

    Wow! In the end I got a webpage from where I be capable of in fact take helpful information regarding my study and knowledge.

Comments are closed.