xem / ama

Ask me anything!
5 stars 0 forks source link

How did you get into codegolfing and why? #8

Closed sindresorhus closed 9 years ago

sindresorhus commented 9 years ago

http://xem.github.io/golfing/

And what should one read to get started with codegolfing?

xem commented 9 years ago

Hi! Thanks for your questions! I just followed you on Twitter & Github =)

I discovered code-golfing in 2012 with http://js1k.com, as a spectator. I was amazed by the demos present on this site and how cryptic their source code were. I looked for other "contests" like that and found http://140byt.es, http://codegolf.stackexchange.com, http://pouet.net, etc.

There were also some ancient "4k" and "10k" contests but they had already stopped at that time. I asked myself the same question as you: it's so cool but it seems so hard... how could I get started? No one answered that question, and it took months before I finally decided to open a github account and develop my first mini-app, without showing it to anyone. If you read http://xem.github.io/golfing from bottom to top, you'll find a few simple experiments that I did to train myself, until I started to develop a full game, Minisweeper: http://xem.github.io/golfing/#minisweeper_en

The process was more or less identical to what I do when I golf today: I started by coding the app in regular (non-golfed) HTML/JS. If you look at the first commit of the project, you'll see this version: https://rawgit.com/xem/MiniSweeper/89c4f3aede6379e2c606a85b4864ccec53eee5a4/index.html. As you can see in the source code, I just minified my original source code with Closure Compiler and counted the bytes: 735. At this step, it's not golfed, it's just functional and minified. In the next commits (https://github.com/xem/MiniSweeper/commits/gh-pages?page=2), I found some simple tricks that could shorten the code a little, and I kept maintaining both the unminified and the minified source code. In as quick as 4 days,, the demo fell to 680 bytes. I talked about it on twitter and my friend @subzey (who I only saw on 140byt.es) agreed to join the adventure, and in almost a week, we managed to iterate again and again and again, and the project and we managed shave it until 480b. (https://github.com/xem/MiniSweeper/commits/gh-pages?page=1)

One of the most rewarding achievements in code-golfing (and it happened on most of our projects) is certainly when we manage to break a "power of two" barrier (128b, 256b, 512b, 1024b), especially when the code is two or three times bigger at the origin. Of course, it's especially rewarding on 140byt.es and js1k, because there, the max size is already fixed by the contest rules.

This game stayed unnoticed, but I was happy with what we had done and I learned a lot of new tricks thanks to @subzey. So I decided to continue and turn an old unnoticed project that I had called "MiniCodeEditor" into a code-golfed app. It was just a JSfiddle clone, and I wouldn't have bet on its success. It looked like that when I first code-golfed it: https://rawgit.com/xem/miniCodeEditor/7ca9467ef6b0bc74e332ac975c7dcff62495898c/index.html

Surprisingly, everyone instantly seemed to find that project supercool, and all my code-golf idols (@p01 @aemkei and @subzey) joined me. After ~65 iterations, we managed to turn those 275b into 158 (https://xem.github.io/miniCodeEditor/).

The success was overwhelming, we appeared at the top of Hacker News for an entire afternoon (https://twitter.com/MaximeEuziere/status/409000716720566274) and blogs worldwide talked about it. Not bad for a 2nd project!

Strong of this success, I started many other tiny projects like that and had the guys golf them with me. I also contributed to other person's projects, and competed in js1k (in 2014 and 2015) and in js13kgames (in 2014). You can read post-mortems on my blog, and see a curated list of our work here: https://gist.github.com/xem/206db44adbdd09bac424

It's like a drug now, and I'm always looking for new ideas or opportunities to code-golf something cool :)

If you want to get started, i'd suggest you to read the 140byt.es tricks: https://github.com/jed/140bytes/wiki/Byte-saving-techniques

And look for videos of Jed Schmidt, Martin Kleppe and Mathieu Henri online, they're very good to introduce this subject.

Cheers!

sindresorhus commented 9 years ago

:+1: Interesting. Thanks for sharing :)

I've only done some super simple 140bytes ones:

xem commented 9 years ago

oh, great!